Cara baru Membuat Menu Floating Fixed

Gambar diatas adalah preview dari menu floating fixed. Yang dimaksid adalah menu yang selalu berada dipojok atas meskipun page akan discroll oleh mouse.

cara membuat menu floating fixed seperti diatas tidaklah sulit. Ikutih langkah-langkah berikut ini

1. Login ke blogger anda


2. Pilih template


3. Edit HTML


4. Cari kode ]]></b:skin> ( tekan f3 untuk memudahkan pencarian)


5. copy kode berikut dan pastekan tepat diatas kode no 4

/* Floating Menu */ #float-aroxx{background-color: #882222;background: #882222;background: -moz-linear-gradient(top, #1484ce 0%, #1274b5 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1484ce), color-stop(100%,#1274b5));background: -webkit-linear-gradient(top, #1484ce 0%,#1274b5 100%);background: -o-linear-gradient(top, #1484ce 0%,#1274b5 100%);background: -ms-linear-gradient(top, #1484ce 0%,#1274b5 100%);background: linear-gradient(to bottom, #1484ce 0%,#1274b5 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1484ce', endColorstr='#1274b5',GradientType=0 );border-bottom: 1px solid rgba(255, 255, 255, 0.1);box-shadow: 0 2px 0 #0E5A8C;box-shadow: 0px 2px 0px #0e5a8c;height:34px;width:100%;min-width:1010px;position:fixed;top:0;left:0;z-index:9999;overflow:hidden;border-bottom:1px solid #2a8fd2;} #float-aroxx{list-style: none;margin:0 auto;width:1010px;} #float-aroxx ul li{float:left} #float-aroxx ul li a{line-height:34px;padding:0 15px;color:#f0e8e5;font-size:13px;font-family:Arial, sans-serif;text-shadow:0px -1px 0px #0f669f;display:block;text-decoration:none;border-right: 1px solid #1470ad;border-left:1px solid #2a88c6;} #float-aroxx ul li a:hover{background-color:rgba(255,255,255,0.125);color:white;}

6. Copy kode dibawah ini dan pastekan tepat dibawah kode tag </head>

<br /><br /><!-- Floating Menu--><br /><br /><div id='float-aroxx'><br /><ul><br /><li style='border-left:1px solid rgba(30, 30, 30, 0.125);'><a href='/'><img alt='Home' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirK8r1z25aW-DXOkAAjTDX3YcT-fk2IRv5Q9ThOBQ6ip7aeErouTbxxQwh03544Cq6B4LBI35f7JnawBVAqV_kNajw1c-qMkYf6nQBM23F8CHKFRHLOWXwW6cBBFlUafi0W_Qq00hsiR4/' style='padding:0px;'/></a></li><br /><li><a href='http://tetap-belajar.blogspot.com/search/label/Pustaka'>PUSTAKA</a></li><br /><li><a href='http://tetap-belajar.blogspot.com/search/label/Windows'>TRIK WINDOWS</a></li><br /><li><a href='http://tetap-belajar.blogspot.com/search/label/blogger'>TUTORIAL BLOGGER</a></li><br /><li><a href='http://tetap-belajar.blogspot.com/search/label/facebook'>TRIK FACEBOOK</a></li><br /><li><a href='http://tetap-belajar.blogspot.com/search/label/software'>SOFTWARE</a></li><br /><li><a href='http://tetap-belajar.blogspot.com/search/label/full%20info'>FULL INFO</a></li><br /><li><a href='http://tetap-belajar.blogspot.com/p/blog-page_28.html'>SI AUTHOR</a></li><br /></ul><br /></div><br />

Link-link anda bisa sesuaikan sesuai keinginan sobat

Begitu cara membuat menu floating fixed...!! gampang kan??