Designing a drop down menu may take a few hours. Using Superfish library, you can save a lot of time in drop down menu design.
Superfish library can be downloaded from:
http://users.tpg.com.au/j_birch/plugins/superfish/
Superfish is an enhanced Suckerfish-style menu jQuery plugin that takes an existing pure CSS drop-down men. Superfish automatically detects the presence of Brian Cherne’s hoverIntent plugin and uses its advanced hover behavior for the mouseovers
To use Superfish is quite simple:
<script type="text/javascript" src="superfish.js"></script>
<script>
$(document).ready(function() {
$('ul.sf-menu').superfish();
});
</script>
Demo for Superfish horizontal drop down menu:
Demo for Superfish vertical drop down menu:
You only need to change the following from horizontal menu:
<link rel="stylesheet" media="screen" href="css/superfish-vertical.css" />
At the beginning of menu list in HTML code, change
<ul class="sf-menu ">
to
<ul class="sf-menu sf-vertical">
No comments:
Post a Comment