jquery animated menu_问答_开发者_运维开发者技术经验分享

开发者 https://www.devze.com 2023-03-12 22:27 出处：网络

ASP.NET menu with jquery for sliding menu effect. I added this code and it is working Fine. The Problem is the ul.level2 are showing and hiding once being mouseout from the ul.level1

ASP.NET menu with jquery for sliding menu effect. I added this code and it is working Fine. The Problem is the ul.level2 are showing and hiding once being mouseout from the 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&开发者_如何学Pythongt;
</body>
</html>

From the documentation, mouse over and mouse out are usually one query, not separated. All one function

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

For the sliding effect try slideUp() and slideDown().