Javascript菜单无法运行Firefox

Question

我正在开发一个带子菜单的水平菜单。当用户将鼠标悬停在父菜单上时，我需要使用Javascript来显示子菜单。

我在JSFiddle中写了一个例子，但它似乎在FireFox中失败了！在Chrome中，IE和Safari正在运行！

这是测试页面： www.andreferreira.eu5.org

这里是代码： jsfiddle.net/R2ySL/

<script>
$(document).ready(function () {
    var $nav = $('#menu > li');
    $nav.hover(
        function() {
            $('li', this).stop(true, true).slideDown('fast');

            $('a',this).first().css({"background-color":"#FFF", "color":"#debe65"});
        },
        function() {

            $('ul', this).slideUp('fast');
           $('a',this).first().css({"background-color":"", "color":"#FFF"});
        }
    );
});
</script>

Answer 1

您可以通过javascript更改css规则，只需将以下内容添加到样式表

即可

#menu li:hover > a {
    color: #debe65;
    background-color: #FFF;
    text-decoration:none;
}

和javascript看起来应该是

$(document).ready(function () {
    var $nav = $('#menu > li');
    $nav.hover(

    function () {
        $('li', this).stop(true, true).slideDown('fast');
    },

    function () {

        $('ul', this).slideUp('fast');
    });
});