1

我是初学者级别的 jquery，我设置了这个脚本，但我需要修改它。我想要它，以便在悬停时，箭头向右移动 3px，然后回到左侧原始位置..在鼠标移出之前。

现在它被设置为返回到原来的位置但是......只有在鼠标移开之后。我想在悬停中包含该步骤作为回调。所以它连续向右然后向左移动。悬停和移出的红框效果保持不变。

这是我到目前为止的脚本，但在更改它时遇到了问题。任何帮助都会很棒，这样我就可以学习。

<script type="text/javascript">

$(document).ready(function() {
    var $red   = $('#red');
    var $arrow = $('#arrow');
    $('#wording').hover(
      function() {
        $red.animate({'width': 'toggle'});
        $arrow.css('color', 'white').delay(100).animate({'right': '-=3px'}, 'fast');
      }, function() {
        $red.animate({'width': 'toggle'});
        $arrow.css('color', 'red').delay(100).animate({'right': '+=3px'}, 'fast');
     });
});

</script>
4

1 回答 1

2 
$('#wording').on('mouseenter', function() {
  $red.animate({'width': 'toggle'});
  $arrow.css('color', 'white').delay(100).animate({'right': '-=3px'}, 'fast', function(){
    $red.animate({'width': 'toggle'});
    $arrow.css('color', 'red').delay(100).animate({'right': '+=3px'}, 'fast');
  });
});

回调作为第三个参数传递给animate

于 2012-05-18T14:56:25.933 回答