How this jQuery menu works?
i am going to site http://www.1stwebdesigner.com/ and found that they have a menu on the top header who have li like freebies and inspiration.
i puzzle a lot but not found where is the code for the menu. how i can see the code written for that.
i am trying with firebug. can anyone tell me where the code located for that.
Update
Here is my code:
<!DOCTYPE html>
<html>
<head>
<title> - testing</title>
<link href="/Content/topmenu.css" rel="stylesheet" type="text/css" />
<link href="/themes/codebix/Content/Style.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="/Content/blueprint/screen.css" type="text/css" media="screen, projection">
<link rel="stylesheet" href="/Content/blueprint/print.css" type="text/css" media="print">
<!--[if IE]><link rel="stylesheet" href="/Content/blueprint/ie.css" type="text/css" media="screen, projection"><![endif]-->
</head>
<body>
<div id="main">
<div class="topmenu">
<ul id="mainMenu">
<li class="cat-item cat-item-3"><span> </span><a href="http://www.1stwebdesigner.com/category/css/">Coding</a>
<ul class="children boxshadow" style="display: none;">
<li class="cat-item cat-item-1026"><span> </span><a href="http://www.1stwebdesigner.com/category/css/cheat_sheets/">Cheat
Sheets</a> </li>
<li class="cat-item cat-item-1024"><span> </span><a href="http://www.1stwebdesigner.com/category/css/html_css/">HTML
& CSS</a> </li>
<li class="cat-item cat-item-1027"><span> </span><a href="http://www.1stwebdesigner.com/category/css/js_ajax/">JS
& AJAX</a> </li>
<li class="cat-item cat-item-1028"><开发者_如何学JAVAspan> </span><a href="http://www.1stwebdesigner.com/category/css/php-css/">PHP</a>
</li>
<li class="cat-item cat-item-1025"><span> </span><a href="http://www.1stwebdesigner.com/category/css/tutorials-css/">Tutorials</a>
</li>
</ul>
</li>
<li class="cat-item cat-item-6"><span> </span><a href="http://www.1stwebdesigner.com/category/freebies/">Freebies</a>
<ul class="children boxshadow" style="display: none;">
<li class="cat-item cat-item-1007"><span> </span><a href="http://www.1stwebdesigner.com/category/freebies/brushes-freebies/">Brushes</a>
</li>
<li class="cat-item cat-item-1013"><span> </span><a href="http://www.1stwebdesigner.com/category/freebies/fonts-freebies/">Fonts</a>
</li>
<li class="cat-item cat-item-1008"><span> </span><a href="http://www.1stwebdesigner.com/category/freebies/icons-freebies/">Icons</a>
</li>
<li class="cat-item cat-item-1009"><span> </span><a href="http://www.1stwebdesigner.com/category/freebies/patterns-freebies/">Patterns</a>
</li>
<li class="cat-item cat-item-1014"><span> </span><a href="http://www.1stwebdesigner.com/category/freebies/templates-freebies/">Templates</a>
</li>
<li class="cat-item cat-item-1011"><span> </span><a href="http://www.1stwebdesigner.com/category/freebies/textures-freebies/">Textures</a>
</li>
<li class="cat-item cat-item-1012"><span> </span><a href="http://www.1stwebdesigner.com/category/freebies/vectors/">Vectors</a>
</li>
<li class="cat-item cat-item-1010"><span> </span><a href="http://www.1stwebdesigner.com/category/freebies/wallpapers-freebies/">Wallpapers</a>
</li>
</ul>
</li>
<li class="cat-item cat-item-7"><span> </span><a href="http://www.1stwebdesigner.com/category/inspiration/">Inspiration</a>
<ul class="children boxshadow" style="display: none;">
<li class="cat-item cat-item-1015"><span> </span><a href="http://www.1stwebdesigner.com/category/inspiration/illustration-inspiration/">Illustration</a>
</li>
<li class="cat-item cat-item-1016"><span> </span><a href="http://www.1stwebdesigner.com/category/inspiration/logos-inspiration/">Logos</a>
</li>
<li class="cat-item cat-item-1017"><span> </span><a href="http://www.1stwebdesigner.com/category/inspiration/photography-inspiration/">Photography</a>
</li>
<li class="cat-item cat-item-1018"><span> </span><a href="http://www.1stwebdesigner.com/category/inspiration/typography-inspiration/">Typography</a>
</li>
<li class="cat-item cat-item-1019"><span> </span><a href="http://www.1stwebdesigner.com/category/inspiration/interfaces/">Web
Interfaces</a> </li>
</ul>
</li>
<li class="cat-item cat-item-4"><span> </span><a href="http://www.1stwebdesigner.com/category/tutorials/">Tutorials</a>
<ul class="children boxshadow" style="display: none;">
<li class="cat-item cat-item-1034"><span> </span><a href="http://www.1stwebdesigner.com/category/tutorials/3d_effects/">3D
Effects</a> </li>
<li class="cat-item cat-item-1035"><span> </span><a href="http://www.1stwebdesigner.com/category/tutorials/coding-tutorials/">Coding</a>
</li>
<li class="cat-item cat-item-1029"><span> </span><a href="http://www.1stwebdesigner.com/category/tutorials/icons-tutorials/">Icons</a>
</li>
<li class="cat-item cat-item-1031"><span> </span><a href="http://www.1stwebdesigner.com/category/tutorials/photo_effects/">Photo
Effects</a> </li>
<li class="cat-item cat-item-1032"><span> </span><a href="http://www.1stwebdesigner.com/category/tutorials/quick_tips/">Quick
Tips</a> </li>
<li class="cat-item cat-item-1033"><span> </span><a href="http://www.1stwebdesigner.com/category/tutorials/text_effects/">Text
Effects</a> </li>
<li class="cat-item cat-item-1030"><span> </span><a href="http://www.1stwebdesigner.com/category/tutorials/web_interface/">Web
Interface</a> </li>
</ul>
</li>
<li class="cat-item cat-item-10"><span> </span><a href="http://www.1stwebdesigner.com/category/design/">Web
Design</a>
<ul class="children boxshadow" style="display: none;">
<li class="cat-item cat-item-1039"><span> </span><a href="http://www.1stwebdesigner.com/category/design/1wd-design/">1WD
Features</a> </li>
<li class="cat-item cat-item-1091"><span> </span><a href="http://www.1stwebdesigner.com/category/design/blogging-design/">Blogging</a>
</li>
<li class="cat-item cat-item-1042"><span> </span><a href="http://www.1stwebdesigner.com/category/design/freelance-design/">Freelance</a>
</li>
<li class="cat-item cat-item-1041"><span> </span><a href="http://www.1stwebdesigner.com/category/design/interviews/">Interviews</a>
</li>
<li class="cat-item cat-item-1040"><span> </span><a href="http://www.1stwebdesigner.com/category/design/news-design/">News</a>
</li>
<li class="cat-item cat-item-1043"><span> </span><a href="http://www.1stwebdesigner.com/category/design/social_media/">Social
Media</a> </li>
<li class="cat-item cat-item-1036"><span> </span><a href="http://www.1stwebdesigner.com/category/design/tips-design/">Tips</a>
</li>
<li class="cat-item cat-item-1037"><span> </span><a href="http://www.1stwebdesigner.com/category/design/tools-design/">Tools</a>
</li>
<li class="cat-item cat-item-1038"><span> </span><a href="http://www.1stwebdesigner.com/category/design/usability-design/">Usability</a>
</li>
</ul>
</li>
<li class="cat-item cat-item-5"><span> </span><a href="http://www.1stwebdesigner.com/category/wordpress/">WordPress</a>
<ul class="children boxshadow" style="display: none;">
<li class="cat-item cat-item-1023"><span> </span><a href="http://www.1stwebdesigner.com/category/wordpress/howto-wordpress/">HowTos</a>
</li>
<li class="cat-item cat-item-1022"><span> </span><a href="http://www.1stwebdesigner.com/category/wordpress/plugins-wordpress/">Plugins</a>
</li>
<li class="cat-item cat-item-1021"><span> </span><a href="http://www.1stwebdesigner.com/category/wordpress/showcase-wordpress/">Showcase</a>
</li>
<li class="cat-item cat-item-1020"><span> </span><a href="http://www.1stwebdesigner.com/category/wordpress/themes-wordpress/">Themes</a>
</li>
</ul>
</li>
<li class="premium"><a title="Go to Premium-Members page" href="http://www.1stwebdesigner.com/premium/">
<span class="icon_menu_7"> </span>Premium</a></li>
</ul>
</div>
</div>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/ecmascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script>
<script src="/Scripts/script.js" type="text/javascript"></script>
</body>
</html>
Stealing is bad thing!
But as we all know, internet is ment to be open-source, so, here it is: http://jsfiddle.net/vcVHg/
You can get all of this, just searching through JavaScript & CSS.
精彩评论