<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>JQuery</title> <script type="text/javascript" src="js/jquery-1.3.min.js"></script> <style> *{ margin:0px; padding:0px; list-style:none; } body{ font-size:12px; } .nav{ float:left; clear:both; margin:100px 0 0 100px; display:inline; } .nav li{ float:left; position:relative; } .nav li a{ display:block; width:80px; padding:8px 0px 6px; text-align:center; color:#000; background:#ccc; text-decoration:none; } .nav li a:hover { background:#666; color:#fff; } .nav li ul{ position:absolute; display:none; } .nav li ul li { float:none; } .nav li ul li a{ background:#eee; } </style> <script type="text/javascript"> $(document).ready(function(){ var li = $("#mainNav li"); //找到#mainNav中子元素li; li.each(function(i){ //循环每一个LI li.eq(i).hover( function(){ $(this).find("ul").slideDown("fast"); //找到li里面的ul元素设置为显示 }, function(){ $(this).find("ul").slideUp("fast"); } ) }) }) </script> </head> <body> <ul id="mainNav" class="nav" > <li><a href="javascript:void(0);">首 页</a></li> <li><a href="javascript:void(0);">导航菜单</a> <ul> <li><a href="javascript:void(0);">采购</a></li> </ul> </li> <li><a href="javascript:void(0);" >企业采购</a> <ul> <li><a href="javascript:void(0);">企业评测</a></li> <li><a href="javascript:void(0);">企业报价</a></li> </ul> </li> <li><a href="javascript:void(0);">行情报价</a> <ul> <li><a href="javascript:void(0);">导航1</a></li> <li><a href="javascript:void(0);">导航2</a></li> <li><a href="javascript:void(0);">导航3</a></li> </ul> </li> </ul> </body> </html>
Deprecated: str_contains(): Passing null to parameter #1 ($haystack) of type string is deprecated in /home/wwwroot/hilau.com/wp-includes/comment-template.php on line 2684
发表评论