Membuat Menu dengan Mousehover Foto Sendiri

Sebenarnya sudah usang tampilan menu seperti ini dan lagi sudah banyak juga yang tahu, namun karena sudah keras hati ingin juga diposting ya egepe meneketehe lah suka-suka gue hehehe...
Kurang lebih tampilannya akan seperti ini

• Edit Disini
• Edit Disini
• Edit Disini
• Edit Disini
• Edit Disini
• Edit Disini
• Edit Disini

Cara pasangnya gampang koq, tinggal masuk menu Rancangan-Elemen Laman-pilih Tambah Gadget yang berada di atas kolom postingan -HTML/JavaScript- paste kode dibawah ini :

<br /> <style type="text/css"> .wireframeauramenu{ font-weight: bold; font-size: 90%;/*sesuaikan */ width: 100%; /*sesuaikan */ } .wireframeauramenu ul{ border: 1px solid #000; /*sesuaikan ketebalan garis luar menu*/ padding: 5px 0;/*sesuaikan lebar vertikal*/ margin: 0; text-align: left; /*sesuaikan pada "left", "center", atau "right"*/ overflow: hidden; } .wireframeauramenu ul li{ display: inline; } .wireframeauramenu ul li a{ color: #330099; padding: 6px 12px 6px 6px; margin: 0; text-decoration: none; border-right: 1px dashed #000; /*border diantara menu item*/ } .wireframeauramenu ul li a:hover{ color: black; background: transparent url(http://gambar anda jpg atau gif) center center no-repeat; /*background menu pada Mouseover*/ } </style><br /> <div class="wireframeauramenu"> <ul> <li><a href="http://www.masbugie.com/">Edit Disini</a></li> <li><a href="http://www.edit me.com//">Edit Disini</a></li> <li><a href="http://www.edit me.com/">Edit Disini</a></li> <li><a href="http://edit me.com">Edit Disini</a></li> <li><a href="http://edit me.com">Edit Disini</a></li> <li><a href="http://edit me.com">Edit Disini</a></li> <li><a href="http://edit me.com">Edit Disini</a></li> </ul> </div>
Gimana, berhasilkah...?

Salam... Description: Membuat Menu dengan Mousehover Foto Sendiri Rating: 3.5 Reviewer: Mas Bugie ItemReviewed: Membuat Menu dengan Mousehover Foto Sendiri