0

我想知道我们怎么能这样做……我什么都没想……

所以我的问题标题可能令人困惑,所以这里是完整的问题。我们如何运行动画但跳过包含 .current... 的一类动画

这是菜单动画,所以我不想为当前类设置动画,因为没有意义。

我可以通过在 CSS 中添加另一个类并使用 !important 作为高度来阻止它。这样看起来好像没有动画,但如果我检查元素,当然有......

JS代码:

$("#topMenu li").mouseover(function(){
    $(this).find('span').stop().animate({ height:'45px' }, { queue:false, duration:600, easing: 'easeOutBounce' });
});

$("#topMenu li").mouseout(function(){
    $(this).find('span').stop().animate({ height:'0px' }, { queue:false, duration:600, easing: 'easeOutBounce' });
});

var currentPage = $('#topMenu span').hasClass('current');

if(currentPage === true) {
    $('span.current').css('display', 'block');
}

所以我可以做到这一点,看起来好像没有动画......但是我们可以以某种方式做到这一点,所以其中包含 .current 类的元素真的没有动画吗?

4

2 回答 2

3
$(this).find('span:not(.current)').stop().animate...
于 2013-02-04T22:28:49.287 回答
1

您可以:not在选择器中添加:

$('#topMenu li:not(.current)').mouseover(...)

如果在添加事件处理程序后动态添加类,请将检查移动到处理程序内部:

$('#topMenu li').mouseover(function () {
  if ($(this).hasClass('current')) return;
  // etc
});
于 2013-02-04T22:29:39.703 回答