的Jquery/JS故障時窗口

我用JS使顯示3項一次一個簡單的功能是不可見的。當您查看頁面時效果很好，但是當您最小化或更改標籤頁然後返回時，會顯示所有三項。的Jquery/JS故障時窗口

任何人都知道爲什麼？就好像fadeIn（x）繼續運行，但hide（）停止工作。我甚至檢查過不同的課程。

下面是代碼：

$(document).ready(function() { 

function start() { 
    $(".featured-items").hide(); 
    $(".item-1").fadeIn('slow'); 
    setTimeout(one, 5000); 
} 
    function one() { 
    $(".featured-items").hide(); 
    $(".item-2").fadeIn('slow'); 
    setTimeout(two, 5000); 
} 
function two() { 
    $(".featured-items").hide(); 
    $(".item-0").fadeIn('slow'); 
    setTimeout(start, 5000); 
} 
setTimeout(start, 5000); 

});

問題解決了，檢查下面的最佳答案，並請務必閱讀評論，從而獲得一個很好的理解。感謝所有

來源

2015-10-20 Helsing

有一個功能，使用模計數器3。 – vogomatix

動畫排隊並且不會運行，直到標籤具有焦點。如果使用.fadeIn的回調，這可能不會發生（循環會直到返回實際上被暫停。） –

爲什麼淡入的作品，但隱藏queus像你說的嗎？ – Helsing

（更新提供完整的答案）

您的原始代碼過於複雜，以及更靈活和更簡單的實現是隻有一個功能，並在庫項目的數組。其次，你應該修改你的代碼，這樣fadeIn動畫立即開始，而不是排隊。只有一個功能而不是幾個功能可以更容易地進行修改。

注意，在下面的代碼，如你的原代碼，不同的畫廊項目類，而不是單一的元素ID，並在多個項目可能會褪色。

var gallery = [ '.item-1', '.item-2', '.item-3' ]; 
var i = 0; 
function galleryEvent() { 
    $(".featured-items").hide(); 
    $(gallery[i]).fadeIn({duration: 'slow', queue: false}); 

    i = (i + 1) % gallery.length; 
    setTimeout(galleryEvent, 5000); 
} 

// start everything off.... 
galleryEvent();

來源

2015-10-20 14:56:36 vogomatix

感謝您解決這個問題。然而，僅僅爲了教育目的，你是否知道爲什麼原始問題會發生？我仍然會使用你的解決方案，這是不言而喻的。 – Helsing

請檢查我的解決方案，因爲我只是在未經測試的情況下迅速將其解決。我不知道爲什麼你的不工作，但簡化它可以更容易找到。您可以在函數啓動時設置調試事件並檢查其被觸發。請注意，'.item-1'是一個類，不是一個單一的元素id - 你的意思是'＃item-1'嗎？ – vogomatix

這不是一個答案 – Igor

的Jquery/JS故障時窗口

回答

相關問題