导航底部,光标滑动

<div class="nav">
    <div class="navBgBox">
        <ul>
            <li><i></i><a href="/html1/folder/1507/1076-1.htm">首页</a></li>
            <li><i></i><span id="NodeTitle"><a href='/' target='_self'>动态动态</a></span></li>
            <li><i></i><span id="NodeTitle"><a href='/' target='_self'>动态动态</a></span></li>
            <li><i></i><span id="NodeTitle"><a href='/' target='_self'>动态动态</a></span></li>
            <li><i></i><span id="NodeTitle"><a href='/' target='_self'>动态动态</a></span></li>
            <li><i></i><span id="NodeTitle"><a href='/' target='_self'>动态动态</a></span></li>
        </ul>
    </div>
<div class="mask"></div>
</div>
<script>
    $(function(){
        var maskLeft = $(".nav .mask").position().left;
        $(".nav ul li").hover(function(){
            $(".nav .mask").stop().animate({"left":$(this).position().left -3});
            },function(){
            $(".nav .mask").stop().animate({"left":maskLeft});
        })
    });
</script>

posted @ 2018-12-20 10:59  大BUG  阅读(190)  评论(0编辑  收藏  举报