Membuat Menu halikopter

Berikut langkah - langkah nya

1. Login ke Akun Blogger anda masing-masing

2. Klik Design atau Rancangan, kemudian pilih edit html

3. Centang Expand Widget Template (saya anjurkan download dahulu template anda)

4. Cari kode : <div id='outer-wrapper'>

5. paste kode di bawah ini di bawahnnya

<style type='text/css'>#japarusimgfb:hover{-o-transform: scale(1.2) rotate(360deg) translate(0px);-moz-transform: scale(1.2) rotate(360deg) translate(0px);-webkit-transform: scale(1.2) rotate(360deg) translate(0px);-o-transition: all 1.5s ease;-moz-transition: all 1.5s ease;-webkit-transition: all 1.5s ease;}
#japarusimgfb{-o-transition: all 1.5s ease;-moz-transition: all 1.5s ease;-webkit-transition: all 1.5s ease;}#menubar {position: fixed;top:0px;z-index: 1000;background:-moz-linear-gradient(top,#14710A,#000);background: -webkit-gradient(linear, left top, left bottom, from(#14710A), to(#000));box-shadow:-2px -2px 8px #14710A, 2px 2px 20px #14710A;-moz-box-shadow:-2px -2px 8px #14710A, 2px 2px 20px #14710A;-webkit-box-shadow:-2px -2px 8px #14710A, 2px 2px 20px #14710A;-moz-border-radius:5px;-webkit-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;width:988px;margin: 0;padding: 0;height:30px;}#menu {width:5000px;height:30px;position:relative}#menu ul {padding:0;margin:0;list-style:none;position:absolute;left:0;top:0;width:5000px;height:30px;z-index:10}#menu ul li {float:left;padding-bottom:4px}#menu ul li#li1 {padding:0}#menu li a {display:block;text-transform:capitalize;height:20px;float:left;color:#fff;text-decoration:none;line-height:20px;padding:0 10px;font-family:kristen itc;font-size:13px;border-right:1px solid #14710A;margin:3px 0 0;}#menu li a:hover {color:#14710A;white-space:nowrap;}#menu li a.current {color:#ffffff;}#menu li a:hover.current {color:#ffffff;}#menu li a:hover b {display:block;width:988px;height:30px;position:absolute;left:0; top:0;z-index:-1;-moz-border-radius:5px;-webkit-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;}#menu li#li1 a:hover b {background: #D11717 -moz-linear-gradient(top,#000,#D11717);background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#D11717));}#menu li#li2 a:hover b {background-image: -moz-repeating-linear-gradient(20deg,rgb(255,0,0),rgb(100,0,0) 50px, rgb(255,0,0) 100px);background: -o-repeating-linear-gradient(20deg,rgb(255,0,0),rgb(100,0,0) 50px, rgb(255,0,0) 100px);background: -webkit-repeating-linear-gradient(20deg,rgb(255,0,0),rgb(100,0,0) 50px, rgb(255,0,0) 100px);}#menu li#li3 a:hover b {background: -moz-linear-gradient(top,#AF0000,#6B0000);background: -webkit-gradient(linear, left top, left bottom, from(#AF0000), to(#6B0000));}#menu li#li4 a:hover b {background: #D11717 -moz-linear-gradient(top,#D11717,#000);background: -webkit-gradient(linear, left top, left bottom, from(#D11717), to(#000));}#menu li#li5 a:hover b {background:-moz-linear-gradient(top,#001C5A,#000);background: -webkit-gradient(linear, left top, left bottom, from(#001C5A), to(#000));}#menu li#li6 a:hover b {background: #244007 -moz-linear-gradient(top,#244007,#000);background: -webkit-gradient(linear, left top, left bottom, from(#244007), to(#000));}#menu li#li7 a:hover b {background: #51A104 -moz-linear-gradient(top,#51A104,#000);background: -webkit-gradient(linear, left top, left bottom, from(#51A104), to(#000));}#menu li#li9 a:hover b {background:-moz-linear-gradient(top,#029BC5,#000);background: -webkit-gradient(linear, left top, left bottom, from(#029BC5), to(#000));}#menu li#li8 a:hover b {background: #40071F -moz-linear-gradient(top,#40071F,#000);background: -webkit-gradient(linear, left top, left bottom, from(#40071F), to(#000));}</style>

<div id='menu'>

<ul>

<li><a href='http://blog-revolusi.blogspot.com/' title='Home'>Home</a>

</li>

<li><a href='http://blog-revolusi.blogspot.com/search/label/software' target='_blank' title='Free Download Software'>Software</a></li>

<li><a href='http://blog-revolusi.blogspot.com/search/label/Game%20Offline' target='_blank' title='Free Download Games'>Games</a></li>

<li><a href='http://blog-revolusi.blogspot.com/search/label/SEO' title='Tutorial Blog'>SEO</a></li>

<li><a href='http://blog-revolusi.blogspot.com/search/label/hacking' title='Hacking'>Hacking</a></li>

<li><a href='http://blog-revolusi.blogspot.com/p/tukar-link.html' title='Tukar Link'>Tukar Link</a></li>

<li><a href='http://bgold-id.blogspot.com' title='Blog Dulur'>Sadulur</a></li>

<li><a href='#' title='Contact Me'>Contact Me</a>

<ul>

<li><a href='http://facebook.com/xbatimtea' title='Xbatim'>My Facebook</a></li>

<li><a href='http://twitter.com/xbatimtea' title='@xbatimtea'>My Twitter</a></li>

</ul></li>

<li><a href='http://www.google.com/support/blogger/?hl=en' title='Help'>Help</a></li>

</ul>

</div>

kemudian simpan

NB: ganti URL dan nama tujuan URL dengan punya mas bro

Tinggalkan komentar yaah..