javascript:下拉菜单特效
1 <html> 2 <head> 3 <title>1</title> 4 <style type='text/css'> 5 #box{ 6 7 } 8 #link_menu{ 9 display:block; 10 float:right; 11 /*visibility:hidden;*/ 12 overflow:hidden; 13 height:18px; 14 text-decoration:none; 15 } 16 #link_menu:hover{ 17 height:218px; 18 } 19 #link_menu:visited{ 20 color:#333333; 21 } 22 #ul_menu{ 23 margin:0px; 24 list-style-type:none; 25 width:120px; 26 height:200px; 27 border:solid 1px green; 28 } 29 #ul_menu li{ 30 padding-left:15px; 31 line-height:25px; 32 font-size:14px; 33 color:#333333; 34 border-bottom:dashed 1px #aaaaaa; 35 cursor:pointer; 36 } 37 #ul_menu li a{ 38 39 } 40 </style> 41 </head> 42 <body> 43 <a id='link_menu'> 44 <span>jacky</span> 45 <ul id='ul_menu'> 46 <li onclick="fun();" onmousedown="fun2();" onmouseover="fun3(this);" onmouseout="fun4(this);">链接项1</li> 47 <li onclick="fun();" onmousedown="fun2();" onmouseover="fun3(this);" onmouseout="fun4(this);">链接项12</li> 48 <li onclick="fun();" onmousedown="fun2();" onmouseover="fun3(this);" onmouseout="fun4(this);">链接项13</li> 49 <li onclick="fun();" onmousedown="fun2();" onmouseover="fun3(this);" onmouseout="fun4(this);">链接项14</li> 50 <li onclick="fun();" onmousedown="fun2();" onmouseover="fun3(this);" onmouseout="fun4(this);">链接项15</li> 51 <li onclick="fun();" onmousedown="fun2();" onmouseover="fun3(this);" onmouseout="fun4(this);">链接项14</li> 52 <li onclick="fun();" onmousedown="fun2();" onmouseover="fun3(this);" onmouseout="fun4(this);">链接项15</li> 53 <ul> 54 </a> 55 <script language='javascript'> 56 window.onload=function(){ 57 temp=object.href; 58 object.href='6-28.html'; 59 } 60 var object=document.getElementById('link_menu'); 61 var temp; 62 function fun(){ 63 location.href='6-29.html'; 64 } 65 function fun2(){ 66 object.href=temp; 67 } 68 function fun3(obj){ 69 obj.style.backgroundColor='lightgreen'; 70 } 71 function fun4(obj){ 72 obj.style.backgroundColor='white'; 73 } 74 </script> 75 76 </body> 77 </html>