/ Published in: jQuery
Expand |
Embed | Plain Text
Copy this code and paste it in your HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en"> <head> <title>superfish</title> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <link rel="stylesheet" type="text/css" href="http://bit.ly/1IXYeT" media="screen"> <link rel="stylesheet" type="text/css" href="http://bit.ly/2EHNk9" media="screen"> <script type="text/javascript" src="http://bit.ly/4zZUbA"></script> <script type="text/javascript" src="http://bit.ly/2dfLeE"></script> <script type="text/javascript" src="http://bit.ly/2Mcyj6"></script> <script type="text/javascript"> $(function(){ $("ul.sf-menu").superfish(); }); </script> </head> <body> <ul class="sf-menu sf-navbar"> <li class="current"> <a href="#a">menu item</a> <ul> <li> <a href="#aa">menu item that is quite long</a> </li> <li class="current"> <a href="#ab">menu item</a> <ul class="sf-menu sf-navbar"> <li class="current"><a href="#">menu item</a></li> <li><a href="#aba">menu item</a></li> <li><a href="#abb">menu item</a></li> <li><a href="#abc">menu item</a></li> <li><a href="#abd">menu item</a></li> </ul> </li> <li> <a href="#">menu item</a> <ul> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> </ul> </li> <li> <a href="#">menu item</a> <ul> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> </ul> </li> </ul> </li> <li> <a href="#">menu item</a> </li> <li> <a href="#">menu item</a> <ul> <li> <a href="#">menu item</a> <ul> <li><a href="#">short</a></li> <li><a href="#">short</a></li> <li><a href="#">short</a></li> <li><a href="#">short</a></li> <li><a href="#">short</a></li> </ul> </li> <li> <a href="#">menu item</a> <ul> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> </ul> </li> <li> <a href="#">menu item</a> <ul> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> </ul> </li> <li> <a href="#">menu item</a> <ul> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> </ul> </li> <li> <a href="#">menu item</a> <ul> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> <li><a href="#">menu item</a></li> </ul> </li> </ul> </li> <li> <a href="#">menu item</a> </li> </ul> </body> </html>