0

我做了一个垂直下拉菜单（宽度 100%）

当鼠标光标悬停在红色部分时，

子菜单（宽度 100%）必须像下拉菜单一样显示...（灰色 BG 部分）

但它不起作用，我不知道出了什么问题....

任何人都可以帮助我吗？

这里是演示...

http://fiddle.jshell.net/B3tZj/

$(document).ready(function () {   
    $("#gnbMenu").hover(
      function () {$('#subWrap').animate({height: "show"}, 300, "easeInOutCubic");}, 
      function () {$('#subWrap').hide();}
    );
});

错误：未捕获的类型错误：对象 # 没有方法“easeInOutCubic”

4

1 回答 1

1

您的动画在easing easInOutCubic中引发错误。

用这个：

function () {$('#subWrap').animate({height:"show",easing:"easeInOutCubic"}, 300)},

代替：

function () {$('#subWrap').animate({height: "show"}, 300, "easeInOutCubic");},

演示在这里 （您的代码已更正）

您可以使用.slideUp() / .slideDown()：

$(document).ready(function () { 
    $("#gnbMenu").hover(
      function () {$('#subWrap').slideDown();}, 
      function () {$('#subWrap').slideUp();}
    );   
});

此处 演示（建议使用上滑/下滑）

编辑：

Sugeestion 对你的评论问题：

$(document).ready(function () {
    $("#gnbMenu").on('mouseenter', function () {
        $('#subWrap').slideDown();
    });
    $("#subWrap").on('mouseleave', function () {
        $('#subWrap').slideUp();
    });
});

演示在这里

注意：此演示使用.on()，需要 jQuery 1.7+

于 2013-09-14T15:28:16.940 回答