Question

我有一个两步动画，在mouseenter上再次发射一次，然后再在mouseleave上发射。

如果我只有一个元素，那么效果很好，但是如果我有多个元素并且从一个元素悬停到另一个元素，则animate（）的回调不会触发，这会扰乱动画。

$('#userIndex .item').mouseenter(function() {
    $this = $(this).find('.inner');     
    $this.animate({
       'opacity': '0.1'
    }, 100, 'linear', function(){
      $this.find('.front').hide();
      $this.find('.back').show();      
      $this.animate({
        'opacity': '1'
      }, 100);
    });
  }).mouseleave(function() {
    $this = $(this).find('.inner');
    $this.animate({
      'opacity': '0.1'
    }, 100, 'linear', function(){
      $this.find('.back').hide();
      $this.find('.front').show();
      $this.animate({
        'opacity': '1'
      }, 100);
    });
  });

示例：http://jsfiddle.net/3KuxS/

Answer 1

看起来像一个简单的范围问题。

<强> jsFiddle example

变化：

$this = $(this).find('.inner');

到

var  $this = $(this).find('.inner');

mouseleave上的jQuery animate（）回调不会触发

1 个答案: