<!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>无标题文档</title> <style type="text/css"> /*格式化CSS*/ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea{*font-size:100%;} .flbox { color:#000; position:absolute; top:200px; left:200px; } .flbox h1 { background:#fcc; float:left; padding:10px; } .flbox h2 { padding:20px; background:#f00; display:none; float:left; clear:both; } </style> <script type="text/javascript" language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> <script type="text/javascript" language="javascript"> $(function(){ $('#flbox').hover(function(){ $(this).find('h2').show(); },function(){ $(this).find('h2').hide(); }); }) </script> </head> <body> <span id="flbox" class="flbox"> <h1>导航菜单一</h1> <h2> 导航下拉菜单<br/>1235123<br />1235123<br /><div style="width:100px; height:100px; margin:50px; background:#ccc;"></div>1235123<br />1235123<br />1235123<br />1235123<br /></h2> </span> </body> </html>
提示:您可以先修改部分代码再运行

未标题-1.jpg (24.99 KB)
2010-5-20 11:20