SimpLe Menu Drop Down Horizontal Di Blog

SimpLe Menu Drop Down Horizontal Di Blog
DEMO Bisa Di Lihat disni Letaknya Paling Atas sekali ...

Langsung ...

1. Login Ke Akun Blog Masing masing
   
2. Pilih Rancangan ,Tambah Gadget Dan Pilih HTML Java Script

Masukan kode ini di dalamnnya

kode:

<style type="text/css">
#japmenu ul li a {position: relative;float: bottom;display: block;width: AUTO;height: 15px;padding: 5px 0 0 0;margin-right: 5px;text-align: center;font-size: 15px;text-decoration: none;color:transparant;font-weight: bold;outline: none;}#japmenu li .current{color: transparant;}#japmenu li a:hover, #japmenu li a:active {background: #4B0082;background: -webkit-gradient(linear, left top, left bottom, from(#4B0082), to(#FF0000)); background: -moz-linear-gradient(top,#4B0082, #FF0000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4B0082', endColorstr='#FF0000'); -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4B0082', endColorstr='#FF0000'); display: inline-block;zoom: 1; *display: inline;border: dotted 1px #555555;padding: 3px 5px;-webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: 0 1px 0px rgba(1,0,0,.1); -moz-box-shadow: 0 1px 0px rgba(0,0,0,.1); box-shadow: 0 1px 0px rgba(0,0,0,.1); -webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out; -webkit-transform:rotate(10deg);-moz-transform:rotate(10deg);-o-transform:rotate(10deg);}color: #ffffff;margin: 0;font-size:18px;padding: 9px 15px 8px;text-decoration: none;}#japmenu {width: auto;float: left;margin: 0;padding: 0;}#japmenu {margin: 0;padding: 0;}#japmenu ul {float: left;list-style: none;margin: 0;padding: 0;}#japmenu li {list-style: none;margin: 0;padding: 0;}#japmenu li a, #japmenu li a:link, #japmenu li a:visited {color: #ffffff;display: block;text-transform: capitalize;margin: 0;padding: 9px 15px 8px;font: Bold 15px Georgia, Arial;}#japmenu li a:hover, #japmenu li a:active {background:transparant;color: #ffffff;margin: 0;font-size:20px;padding: 9px 15px 8px;text-decoration: none;}#japmenu li li a, #japmenu li li a:link, #japmenu li li a:visited {background: #00FFFF;background: -webkit-gradient(linear, left top, left bottom, from(#00FFFF), to(#000000)); background: -moz-linear-gradient(top,#00FFFF, #000000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00FFFF', endColorstr='#000000'); -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00FFFF', endColorstr='#000000'); width: 250px;color: #E6E6FA;-webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; border-style: outset;-webkit-transition:all 0.5s ease-in-out; -moz-transition:all 0.5s ease-in-out;-o-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out; -webkit-transform:rotate(10deg);-moz-transform:rotate(10deg);-o-transform:rotate(10deg);float: none;margin: 0;padding: 7px 10px;border-bottom: transparant;border-left: transparant;border-right: transparant;font: bold 14px kristen itc, Arial;}#japmenu li li a:hover, #japmenu li li a:active {background: #FF0000;background: -webkit-gradient(linear, left top, left bottom, from(#FF0000), to(#00FF00)); background: -moz-linear-gradient(top,#FF0000, #00FF00); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF0000', endColorstr='#00FF00'); -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF0000', endColorstr='#00FF00'); color: #ffffff;font-size:20px;font-family:kristen itc;text-align: center;padding: 7px 10px;}#japmenu li {float: left;padding: 0;}#japmenu li ul {z-index: 9999;position: absolute;left: -999em;height: 20px;width: 170px;margin: 0;padding: 0;}#japmenu li ul a {width: 140px;}#japmenu li ul ul {margin: -32px 0 0 171px;}#japmenu li:hover ul ul, #japmenu li:hover ul ul ul, #japmenu li.sfhover ul ul, #japmenu li.sfhover ul ul ul {left: -999em;}#japmenu li:hover ul, #japmenu li li:hover ul, #japmenu li li li:hover ul, #japmenu li.sfhover ul, #japmenu li li.sfhover ul, #japmenu li li li.sfhover ul {left: auto;}#japmenu li:hover, #japmenu li.sfhover {position: static;}#footer-column-divide {clear:both;}#japmenu{font-family:Comic Sans Ms;background:#000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6PU4VuuhTnl9aT1sAwcvyTnLCZhyhfReNSXnB2bQPXIFAdShlnjYlc3V24e2BIIs14eGQPtxh76f6or_XefSj8K3ez8RQy3XrlAWP7dlbNmv652EE_X7PfTi9v-YYSnnFHCbS2RsZnzDq/)repeat-x;(0,0,0, 0.80);border:1px solid #C0C0C0;padding:2px 0;z-index:999;top:0px;left:1px;right:1px;position:fixed;-moz-border-radius:10px;-webkit-border-radius:10px;}
</style>

<div id='japmenu'>
<ul id='japmenu'>
<li><a href='disini letak link sobat'>Home</a></li>
<li><a href='disini letak link sobat' target='_blank'>Daftar Isi</a></li>
<li><a href='http://kusmizaluna.blogspot.com/' target='_blank'>link7</a>
<ul class='children'>
<li><a href='disini letak link sobat' target='_blank'>link7</a></li>
<li><a href='disini letak link sobat' target='_blank'>link7</a></li>
<li><a href='disini letak link sobat' target='_blank'>link7</a></li>
<li><a href='disini letak link sobat' target='_blank'>link7</a></li>
<li><a href='disini letak link sobat' target='_blank'>link7</a></li>
</ul>
</li>
<li><a href='http://japarus.blogspot.com/' target='_blank'>link8</a>
<ul class='children'>
<li><a href='disini letak link sobat' target='_blank'>link8</a></li>
<li><a href='disini letak link sobat' target='_blank'>link8</a></li>
</ul>
</li>
<li><a href='disini letak link sobat' target='_blank'>link9</a>
<ul class='children'>
<li><a href='disini letak link sobat' target='_blank'>link9</a></li>
<li><a href='disini letak link sobat' target='_blank'>link9</a></li>
<li><a href='disini letak link sobat' target='_blank'>link9</a></li>
</ul>
</li>
<li><a href='http://japarus.blogspot.com/'>link10</a>
<ul class='children' target='_blank'>
<li><a href='disini letak link sobat' target='_blank'>link10</a></li>
<li><a href='disini letak link sobat' target='_blank'>link10</a></li>
</ul>
</li>
<li><a href='disini letak link sobat' title='titleeeeee' target='_blank'>link11</a>
<ul class='children'>
<li><a href='disini letak link sobat'>link11</a></li>
<li><a href='disini letak link sobat' target='_blank'>link11</a></li>
</ul>
</li>
<li><a href='disini letak link sobat' target='_blank'>link12</a></li>
<li><a href='http://kusmizaluna.blogspot.com' title='tutorial' target='_blank'><blink>Tutorial</blink></a></li>
</ul>
</div>

Save ....