Question

用于ASP.NET的

jquery菜单用于滑动菜单效果。我添加了这个代码，它工作正常。问题是ul.level2显示并隐藏mouseout后ul.level1

<html>
<head>
<title>test</title>
<script type="text/javascript" src="jquery.1.4.js"></script>
</head>
<body>
<div id="menu">
<div id="Menu1">
    <ul class="level1">
        <li><a class="level1">Item1</a>
            <ul class="level2">
                <li><a href='#'>SubItem1</a></li>
            </ul>
        </li>   
        <li><a class="level1">Item2</a>
            <ul class="level2">
                <li><a href='#'>Sub1</a></li>
            </ul>
        </li>
    </ul>
</div>  
</div>
<script type="text/javascript">
    $('ul.level1 li a.level1').mouseover(function() {
        $('ul.level1 li a.level1 ul.level2').animate(top:0,height: show);
        });
    $('ul.level1 li a.level1').mouseout(function() {
        $('ul.level1 li a.level1 ul.level2').animate(top:0,height: hide);
        }); 
</script>
</body>
</html>

Answer 1

从文档中，鼠标悬停和鼠标移出通常是一个查询，而不是分开。所有功能

$("div.overout").mouseover(function() {
i += 1;
$(this).find("span").text( "mouse over x " + i );
}).mouseout(function(){
$(this).find("span").text("mouse out ");
});

Answer 2

对于滑动效果，请尝试slideUp()和slideDown()。

jquery动画菜单

2 个答案: