都照著寫,為什么還是沒有效果,問題出在哪了
<!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>無標(biāo)題文檔</title>
<style type="text/css">
*{
margin:0;
padding:0;
}
.container{
margin:0 auto;
width:400px;
}
li{
list-style:none;
float:left;
width:90px;
line-height:34px;
text-align:center;
background:#CCC;
margin-right:1px;
}
a{
text-decoration:none;
color:#000;
font-weight:bold;
display:block;
}
.nav li ul{
block:none;
position:absolute;
height:0;
overflow:hidden;
}
?.nav_pic{
display:block;
height:11px;
background:url(bird.png) 31px no-repeat;
?}
?.nav li a:hover{
background:url(slide-pannel_14.png) repeat-x;
color:#fff;
?}
?.nav_first{
background:url(slide-pannel_14.png) repeat-x;
?}
</style>
? ?<script type="text/javascript">
? ? ? window.onload=function(){
? ?var lis=document.getElementsByTagName("li");
for(var i=0;i<lis.length;i++){
lis[i].onmouseover=function(){
var u=this.getElementsByTagName("ul")[0];
?u.style.display="block"
?addH(u.id);
}
lis[i].onmouseleave=function(){
var u=this.getElementsByTagName("ul")[0];
?subH(u.id);
}
}
? }
? ? ? ?function addH(id){
? var ulLis=document.getElementById("id")[0];
? var h=ulLis.offsetHeight;
? h+=1;
? if(h<45){
? ulLis.style.height=h+"px";
? ?setTimeout(" addH(' "+id+" ')",10);
? }
? else{
? return;
? }
? }
?function ?subH(id){
? var ulLis=document.getElementById("id")[0];
? var h=ulLis.offsetHeight;
? h-=1;
? ?if(h>0){
? ulLis.style.display="none";
? ?setTimeout(" subH(' "+id+" ')",10);
? }
? else{
? return;
? }
? }
? ?</script>
</head>
<body>
? ? <div class="container">
? ? ?<ul class="nav">
? ? ? ?<li class="nav_first"><a href="#">首頁</a></li>
? ? ? ?<li><a href="#">課程大廳</a>
? ? ? ? ? <ul class="munUl">
? ? ? ? ? ? ?<span class="nav_pic"></span>
? ? ? ? ? ? ?<li><a href="#">javascript</a></li>
? ? ? ? ? ? ?<li><a href="#">jQuery</a></li>
? ? ? ? ? ? ?<li><a href="#">css</a></li>
? ? ? ? ? </ul>
? ? ? ?</li>
? ? ? ?<li><a href="#">學(xué)習(xí)我們</a></li>
? ? ? ?<li><a href="#">聯(lián)系我們</a></li>
? ? ?</ul>
? ?</div>
</body>
</html>
2017-01-07
你是沒有用心的吧!里面錯了很多的,你再重新寫一遍就知道了,或者好好的用瀏覽器來測試一下:下面看看自己錯在哪里
?html里就有一個很大的錯誤:<ul class="munUl"></ul> ? ?應(yīng)該為id;
?var ulLis=document.getElementById("id")[0]; ??var ulLis=document.getElementById(id);?
function ?subH(id){
? ? var ulLis=document.getElementById(id);
? ? var h = ulLis.offsetHeight;
? ? h -=1;
? ? ?if(h>0){
? ? ? ? ?ulList.style.display="none";
? ? ? ? ?setTimeout("subH(' "+id+" ')",10);
? ? }
? ? else{
? ? ? ulList.style.display = "none";
? ? return;
? ? }
? }
你好好看看視屏吧,按照視屏教程打是沒有問題的
2016-09-14
window.onload=function(){
? ?var lis=document.getElementsByTagName("li");
? ?for(var i=0;i<lis.length;i++){
? ? ? ?lis[i].onmouseover=function(){
? ? ? ? ? ?var u=this.getElementsByTagName("ul")[0];
? ? ? ? ? ?if(u!=undefined){
? ? ? ? ? ? ? ?u.style.display="block"
? ? ? ? ? ? ? ?addH(u.id);
? ? ? ? ? ?}
? ? ? ?}
? ? ? ?lis[i].onmouseleave=function(){
? ? ? ? ? ?var u=this.getElementsByTagName("ul")[0];
? ? ? ? ? ?if (u!=undefined)
? ? ? ? ? ?{
? ? ? ? ? ? ? ?subH(u.id);
? ? ? ? ? ?}
? ? ? ?}
? ?}
}
不是每個li下都有ul
先判斷下當(dāng)前l(fā)i下有沒有ul?