<title>导航——点击弹出内容</title> <style type="text/css">navgation{margin:;padding:;liststyletype:none;position:relative;}navgation li {float:left;}navgation a{padding:px px;backgroundcolor:orange;color:white;textdecoration:none;float:left;height:px;}navgation a:hover {backgroundcolor:white;color:blue;textdecoration:underline;}navgation div{display:none;position:absolute;top:px;}</style> <script src="Jqueryjs" type="text/javascript"></script> <script type="text/javascript"> $(document)ready(function () { $("navgation input")each(function () { var this_div = $("navgation div"); var _inx = $("navgation input")index(this); $(this)click( function () { this_diveq(_inx)slideToggle(); } function () { this_diveq(_inx)slideToggle(); } ); }); }); </script></head><body> <form id="form" runat="server"> <div> <ul class="navgation"> <li><input type="button" id="button" value="链接"/> <div>这里放下拉内容</div> </li> <li><input type="button" id="button" value="链接"/> <div>这里放下拉内容</div> </li> <li><input type="button" id="button" value="链接"/> <div>这里放下拉内容</div> </li> <li><input type="button" id="button" value="链接"/> <div>这里放下拉内容</div> </li> <li><input type="button" id="button" value="链接"/> <div>这里放下拉内容</div> </li> </ul> </div> </form></body>