在fadeOut完成之前不要fadeIn？答案

【问题标题】：Dont fadeIn till fadeOut completes?在fadeOut完成之前不要fadeIn？
【发布时间】：2014-05-02 07:54:46
【问题描述】：

我在页面顶部有三个小框。当将鼠标悬停在框下方的图像上时，框会淡入。将鼠标悬停在框外时，图像会淡出。但是我将如何编写它，所以如果他们在第一个框之后将鼠标悬停在另一个框上，它允许第一个图像在第二个图像淡入之前淡出？谢谢。

$(document).ready(function(){
    $('#top p').mouseover(function(){
        $('#photo1').fadeIn(2000);
    });
    $('#top p').mouseout(function(){
        $('#photo1').fadeOut(2000);
    });
    $('#top2 p').mouseover(function(){
        $('#photo2').fadeIn(2000);
    });
    $('#top2 p').mouseout(function(){
        $('#photo2').fadeOut(2000);
    });
    $('#top3 p').mouseover(function(){
        $('#photo3').fadeIn(2000);
    });
    $('#top3 p').mouseout(function(){
        $('#photo3').fadeOut(2000);
    });
});

【问题讨论】：

标签： jquery hover fadein fadeout

【解决方案1】：

当一个函数完成时，使用complete 函数运行您的代码。例如，

$('#top p').mouseover(function(){ $('#photo1').fadeIn(2000, function(){ //这将在淡入完成时运行 }); });

【讨论】：

【解决方案2】：

这是您的解决方案。在您的淡入淡出之后立即输入以下内容。

setTimeout(function(){
        //Your fadeout function here
},3000)

setTimeout 在执行其中的函数之前设置了一个延迟。我尝试使用 delay() 但没有奏效。我相信这对你有用。3000 是在执行之前等待的时间（毫秒）。我通常将它设置为等于之前的淡入淡出函数，这样一旦它完成，淡出就会在 setTimeout 片段中开始。我喜欢使用 setTimeout 是因为它比其他的更广泛，而且我使用它的方式比简单的淡入淡出要多得多。

【讨论】：