Question

我想在菜单栏上添加一些动画，代码如下

HTML

<ul class="my_menu">
    <li class="home">
        <p><a href="#">Home</a></p>
        <p class="subtext">The front page</p>
    </li>
    <li class="about">
        <p><a href="#">About</a></p>
        <p class="subtext">More info</p>
    </li>
</ul>

的Javascript

宽松： http://buildinternet.com/live/smoothmenu/js/jquery.easing.1.3.js

脚本：

$(document).ready(function(){
    $("ul.my_menu> li").mouseover(function(){
        alert('hi');
        $(this).stop().animate({height:'150px'},{queue:false, duration:600, easing: 'easeOutBounce'});
    });

    $("ul.my_menu > li").mouseout(function(){
        alert('bye');
        $(this).stop().animate({height:'50px'},{queue:false, duration:600, easing: 'easeOutBounce'});
    }); 
});

最后，无法显示“hi”和“bye”。我的代码有问题吗？提前谢谢。

已编辑：已更改am_menu - ＆gt; my_menu

Answer 1

你的选择器不应该是ul.my_menu吗？

$("ul.my_menu > li")

Answer 2

我在你的HTML中找不到类.am_menu。我认为它应该替换为ul.my_menu。

错误：

`$("ul.am_menu > li").mouseover(function(){`  //No class .

修复：

`$("ul.my_menu > li").mouseover(function(){`

JQuery用类名查找ul

2 个答案: