Jquery下拉菜单消失后删除类

发布于 2024-09-18 00:58:11 字数 591 浏览 5 评论 0原文

我有一个下拉菜单代码，在菜单向上滑动并消失后，我需要删除“#products”上的“悬停”类。我该怎么做？目前，它在鼠标移出时立即消失

感谢您解决此问题的任何帮助！ :-)

$(function() {
    var divTop = 168;
    $('#products div ul').css({'margin-top': '-' + divTop + 'px','float':'left'});

    $('#products > a,#products div').hover(function(){
        $('#products').addClass('hovered');
        $('#products div ul').show().stop().animate({'margin-top': '0'});
    },function(){
        $('#products').removeClass('hovered');
        $('#products div ul').show().stop().animate({'margin-top': '-' + divTop + 'px'});
    });
});

原文

I have this code for a dropdown and I need to remove the class 'hovered' on '#products' after the menu slides up and has disappeared. How do I do this? Currently it disappears straight away onmouseout

Thanksfor any help in resolving this! :-)

$(function() {
    var divTop = 168;
    $('#products div ul').css({'margin-top': '-' + divTop + 'px','float':'left'});

    $('#products > a,#products div').hover(function(){
        $('#products').addClass('hovered');
        $('#products div ul').show().stop().animate({'margin-top': '0'});
    },function(){
        $('#products').removeClass('hovered');
        $('#products div ul').show().stop().animate({'margin-top': '-' + divTop + 'px'});
    });
});

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

神经大条 2024-09-25 00:58:11

您可以在 .removeClass() 中调用http://api.jquery.com/animate/" rel="nofollow noreferrer">.animate() 回调，如下所示：

$(function() {
    var divTop = 168;
    $('#products div ul').css({'margin-top': '-' + divTop + 'px','float':'left'});

    $('#products > a,#products div').hover(function(){
        $('#products').addClass('hovered');
        $('#products div ul').show().stop().animate({'margin-top': '0'});
    },function(){            
        $('#products div ul').show().stop().animate({'margin-top': '-' + divTop + 'px'}, function() {
          $('#products').removeClass('hovered');
        });
    });
});

You can call .removeClass() in the .animate() callback, like this:

$(function() {
    var divTop = 168;
    $('#products div ul').css({'margin-top': '-' + divTop + 'px','float':'left'});

    $('#products > a,#products div').hover(function(){
        $('#products').addClass('hovered');
        $('#products div ul').show().stop().animate({'margin-top': '0'});
    },function(){            
        $('#products div ul').show().stop().animate({'margin-top': '-' + divTop + 'px'}, function() {
          $('#products').removeClass('hovered');
        });
    });
});

回复收藏 0 原文

旧夏天 2024-09-25 00:58:11

您可以将其

function(){
$('#products').removeClass('hovered');
}

作为 animate() 函数的回调

You could probably put

function(){
$('#products').removeClass('hovered');
}

as the callback of the animate() function

回复收藏 0 原文

雨轻弹 2024-09-25 00:58:11

如果我正确理解你，似乎你只需要使用 .animate() 的回调函数（参考：

$(function() {
    var divTop = 168;
    $('#products div ul').css({'margin-top': '-' + divTop + 'px','float':'left'});

    $('#products > a,#products div').hover(function(){
        $('#products').addClass('hovered');
        $('#products div ul').show().stop().animate({'margin-top': '0'});
    },function(){
        $('#products div ul').show().stop().animate({'margin-top': '-' + divTop + 'px'}, function(){
            $('#products').removeClass('hovered');
        });
    });
});

If I understand you properly, it seems like you just need to make use of the callback function of .animate() (REF: http://api.jquery.com/animate/).

$(function() {
    var divTop = 168;
    $('#products div ul').css({'margin-top': '-' + divTop + 'px','float':'left'});

    $('#products > a,#products div').hover(function(){
        $('#products').addClass('hovered');
        $('#products div ul').show().stop().animate({'margin-top': '0'});
    },function(){
        $('#products div ul').show().stop().animate({'margin-top': '-' + divTop + 'px'}, function(){
            $('#products').removeClass('hovered');
        });
    });
});

回复收藏 0 原文

~没有更多了~