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

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 代码以在多个
  按钮
• 添加了另一个按钮来显示
  你认为它有效