Cara Membuat Tab Menu Melayang

Dari sekian banyak Tab Menu, dan ada beberapa yang sudah saya bahas disini, :w; rasanya ada yang kelupaan yaitu Tab Menu yang saya beri nama Tab Menu Melayang yang bisa menggulung / Spoiler [bisa buka tutup kalau mouse didekatkan] :z; 

Sedikit saya bahas apa kelebihan dari Tab Menu ini dibandingkan dengan yang pernah saya posting, diantaranya diperlukan tempat yang lebih sedikit tapi di dalamnya kaya isi, dan bisa ditampilkan dimana kawan suka [kiri atas, kanan atas maupun dibawah] cuma dengan mengganti text posisinya :z; Demonya kawan bisa lihat » disini 

Caranya membuatnya :

• Masuk Account Blogger dengan ID kawan
• Pada Dasbor pilih Template - Edit HTML
• Copas kode Css berikut dan taruh diatas ]]></b:skin>

#begomenu{position:fixed;left:5px;top:5px;background-color:#236C95;border-radius:10px;-moz-border-radius:10px;border:1px solid #FFF;width:212px;height:20px;color:#FF0;transition:all .5s ease-in;-moz-transition:all .5s ease-in;-webkit-transition:all .5s ease-in;-o-transition:all .5s ease-in;z-index:3;overflow:hidden;padding:9px 15px 10px;}

#begomenu h3{margin:0;padding:0;text-align:center;cursor:pointer;font-size:14px;}

#begomenu ul{border-radius:10px;-moz-border-radius:10px;border:2px solid #FF0;background-color:#95CAFF;margin:15px 0;padding:0 15px;}

#begomenu li{list-style:none;margin:0 0 5px;padding:0;} #begomenu li a{color:#00F;text-decoration:none;font-size:11px;}

#begomenu li a:hover{color:#F00;}

#begomenu:hover{z-index:5;height:210px;}

Text warna merah adalah posisi tampilan, silahkan disesuaikan].
Text yang berwarna biru adalah untuk warna background luar dengan font warna Kuning  :r; dan begitu seterusnya  :r;
Teks yang saya beri warna violet adalah lebar dan tinggi Tab silahkan disesuaikan 

• Kalau sudah pas simpan template kawan 
• Selanjutnya pilih Tata Letak
• Pilih Tambah Gadget - HTML/JavaScript [bisa digabung pada Gadget lainnya]
• Copas kode HTML berikut kedalamnya 

<div id="begomenu"><h3>TAB MENU MELAYANG</h3><ul><li><a href="http://tips-blogbego.blogspot.com/p/siapa-saya.html" title="adalah Profil saya" target="_blank">SIAPA SAYA</a></li> <li><a href="http://tips-blogbego.blogspot.com/p/kontak-kami.html" title="untuk menghubungi saya" target="_blank">KONTAK KAMI</a></li><li><a href="http://www.facebook.com/?ref=home/" target="_blank" title="Facebook Putu Blogbego">FACEBOOK</a></li> <li><a href="http://info-blogbego.blogspot.com/" target="_blank" title="info blog dan komputer berbahasa inggris">BLOG & COMPUTING INFO</a></li> <li><a href="http://www.alambali.co.cc/" target="_blank" title="informasi wisata di Bali berbahasa Inggris">ALAM BALI.CO.CC</a></li> <li><a href="http://melajah-di.blogspot.com/" target="_blank" title="informasi Bali : Budaya, sejarah dll">MELAJAH DI</a></li> <li><a href="http://blog-bego.blogspot.com/" target="_blank" title="Blog untuk Demo">BLOGBEGO</a></li> </ul></div>

Silahkan ganti URL saya dengan URL kawan, dan kalau semuanya sudah pas jangan lupa simpan Template kawan dan lihat hasilnya :x; 

Berbagi Artikel :

Cara Membuat Tab Menu Melayang

Blog Bego, Blogger, tips trik, widget,

Rate this posting:

{[["☆","★"]]}

Kalau pada Artikel Cara Membuat Tab Menu Melayang
kurang jelas atau ada Artikel, Link yang tak jalan / rusak bisa disampaikan lewat Komentar
mudah-mudahan saya bisa segera memperbaiki
---ooOOOoo---