一个超复杂的鼠标焦点显示二级菜单网页特效_导航菜单

<!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"> <!-- body li div { display: none; } --> </style> </head> <body> <ul id='www.aiyiwb.com'> <li>a <div>1</div> </li> <li>b <div>2</div> </li> <li>c <div>3</div> </li> </ul> <script type="text/javascript"> window.onload=function(){ var abc=document.getElementById('abc'); var locLi=abc.getElementsByTagName('li'); var locDiv=abc.getElementsByTagName('div'); for(var i=0;i<locLi.length;i++){ locLi[i].onmouseover=function(){ displayDiv(this,'over'); //alert(this); } locLi[i].onmouseout=function(){ displayDiv(this,'out'); } } function displayDiv(thisLi,enType){ for(j=0;j<locDiv.length;j++){ if(locDiv[j].parentNode==thisLi && enType=='over'){ locDiv[j].style.display='block'; }else{ locDiv[j].style.display='none'; } } } } </script> </body> </html>

 
posted @ 2013-05-04 13:28  1870764108  阅读(126)  评论(0)    收藏  举报