jQuery Smooth Drop Menu
Kod Untuk Drop Menu ini:
<script src="http://jquery.com/src/jquery.js"></script>
<script>
jQuery.noConflict();
(function($) {
$(document).ready(function(){
$("li.item > ol").hide();
$("li.item").hover(function(){
$("ol",this).slideDown("fast");
},function(){
$("ol",this).slideUp("fast");
});
});
})(jQuery);
</script>
<style>
body { font-family: Arial; font-size: 16px; }
ol { list-style: none; margin: 0; padding: 0; }
li.item { float: left; width: 150px; background: #F39; margin: 5px; }
li.item a { font-size: 18px; color: #FFF; margin: 4px; }
li.item ol { background: #FFF; margin: 3px; }
li.item ol a { font-size: 16px; color: #000; margin: 0; }
</style>
<ol class="menu">
<li class="item"><a href="/">jQuery</a>
<ol>
<li><a href="/src/">Download</a></li>
<li><a href="/docs/">Documentation</a></li>
<li><a href="/blog/">Blog</a></li>
</ol></li>
<li class="item"><a href="/discuss/">Community</a>
<ol>
<li><a href="/discuss/">Mailing List</a></li>
<li><a href="/tutorials/">Tutorials</a></li>
<li><a href="/demos/">Demos</a></li>
<li><a href="/plugins/">Plugins</a></li>
</ol></li>
<li class="item"><a href="/dev/">Development</a>
<ol>
<li><a href="/src/">Source Code</a></li>
<li><a href="/dev/bugs/">Bug Tracking</a></li>
<li><a href="/dev/recent/">Recent Changes</a></li>
</ol></li>
</ol>