为了账号安全,请及时绑定邮箱和手机立即绑定

老师,请附上源码。然后,代码快速移入移除貌似有问题

老师,请附上源码吧!有时候出问题了担心是不是我自己写错了

正在回答

2 回答

你可以清除 setTimeout

0 回复 有任何疑惑可以回复我~

是的我也发现了一点在移入移出的问题,可以互相交流一下

<pre>
<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
        .top-nav
        {
        font-size: 14px;
        font-weight: bold;
        list-style-type: none;
        }
        .top-nav li
        {
        float: left;
        margin-right: 1px;
        }
        .top-nav li a
        {
        line-height: 34px;
        text-decoration: none;
        background: #3f240e;
        color: #fff;
        display: block;
        width: 80px;
        text-align: center;
        }
        .top-nav ul
        {
        list-style: none;
        display: none;
        padding: 0;
        position: absolute;
        height: 0;
        overflow: hidden;
        }
        .top-nav li a:hover
        {
        background:url(./img/button.png)0 -2px repeat-x;
        }
        .note
        {
        color: #3f240e;
        display: block;
        background:url(./img/button.png)0 -2px repeat-x;
        }
        .corner
        {
        display: block;
        height: 11px;
        background:url(./img/corner.png) 31px 0 no-repeat;
        }
        </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];
                    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);
                    }
                }
            }
        }
        function AddH(id){ 
            var uList=document.getElementById(id);
            var h=uList.offsetHeight;
            h+=1;
            if(h<=45){ 
                uList.style.height=h+"px";
                setTimeout("AddH('"+id+"')",10);
            }
            else{ 
                return;
            }
        }
        function SubH(id){ 
            var uList=document.getElementById(id);
            var h=uList.offsetHeight;
            h-=1;
            if(h>0){ 
                uList.style.height=h+"px";
                setTimeout("SubH('"+id+"')",10);
            }
            else{ 
                ulList.style.display="none";
                return;
            }
        }
        </script>
    </head>
    <body>
        <ul class="top-nav">
            <li>
                <a href="#">
                    <span>慕课网</span>
                </a>
            </li>
            <li>
                <a href="#">课程大厅</a>
            </li>
            <li>
                <a href="#">学习中心</a>
                <ul id="menuL">
                    <span class="corner"></span>
                    <li>
                        <a href="#">前端课程</a>
                    </li>
                    <li>
                        <a href="#">手机开发</a>
                    </li>
                    <li>
                        <a href="#">后台开发</a>
                    </li>
                </ul>
            </li>
            <li>
                <a href="#">关于我们</a>
            </li>
        </ul>
    </body>
</html>
</pre>


0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
形形色色的下拉菜单
  • 参与学习       106972    人
  • 解答问题       543    个

本教程从易到难,循循渐进,运用不同技术实现动态下拉菜单

进入课程

老师,请附上源码。然后,代码快速移入移除貌似有问题

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信