Question

我有以下简单的向下滑动悬停菜单。

 $(function(){
$('.sub-menu').hide();
$('.menu-item').hover(
    function () {
        var target = $(this).children('ul');
        $.browser.msie ? target.show() : target.slideDown(150);
    },
    function () {
        var target = $(this).children('ul')
        $.browser.msie ? target.hide() : target.slideUp(150);
    }
);

}）;

当你将鼠标悬停在.menu-item上时，它会向下滑动.sub-menu，当你离开时，它会向上滑动，完美。

当你将鼠标悬停在.menu-item上时，我需要它向上滑动.sub-menu，反之亦然。

我已经完成了交换slideUp和slideDown的明显效果，但似乎无法正常工作。

有什么想法吗？

非常感谢你能否：）

Answer 1

$(function(){
    $('.menu-item').hover(
        function () {
            var target = $(this).children('ul');
            $.browser.msie ? target.hide() : target.slideUp(150);
        },
        function () {
            var target = $(this).children('ul')
            $.browser.msie ? target.show() : target.slideDown(150);
        }
    );
});

应该可行，但如果没有更多代码我无法测试。

基本上我假设.sub-menu已经显示，所以当你将鼠标悬停在。menu-item上时，你想隐藏它，对吗？

我改变的一切是：我换了两个函数并删除了开头的$('.sub-menu').hide();。它实际上滑动之前不需要隐藏。

编辑：处理您的最新示例。

请在此处查看：http://jsfiddle.net/GwBuj/3/

我做的是：

将#button和#slider更改为课程（.button和.slider）
相应地修改CSS，并且已更改.slider CSS以允许多个按钮（你有它绝对定位哪个不会允许你看到其他人）
调整JQuery代码以处理多个按钮
添加了另一个要显示的按钮你有效吗

简单的jQuery悬停向下滑动，反向向上滑动？

1 个答案: