Question

这段代码给了我一个错误，鼠标悬停它显示了背景变化的延迟，我真的不知道它的问题是什么。有谁知道问题是什么？

$('#compareDiv').hover(
     function(){
         $(this).data( $(this).css('background') );
         $(this).fadeOut().css('background', 'url(images/compare-V1.png) bottom left no-repeat' ).fadeIn();  
     },

     function(){ 
       $(this).fadeOut().css('background', $(this).data('background') ).fadeIn(); 

     } );

check this out

Answer 1

你想做什么？其中一个问题是fadeOut（）方法是异步的。这意味着，您必须提供回调才能在动画完成后执行函数。动画启动后，您的css背景就会立即设置。此外，由于你在fadeOut（）之后链接fadeIn（），它可能会产生一些奇怪的结果。您需要为动画方法提供回调，如下所示：

$(this).fadeOut(function() {
    $(this).css('background', 'url(images/compare-V1.png) bottom left no-repeat');
    $(this).fadeIn();
});

你要遇到的另一个问题是，如果用户徘徊并且很快就会徘徊，动画将会排队。我建议在开始动画之前使用短暂的延迟，如果用户快速徘徊，则取消超时。

背景淡入的错误和延迟

1 个答案: