用javascript/jquery僞裝一個Gif

我有一個隱藏和顯示基於pageY位置的滾動div的函數，但我也需要能夠讓它自動隱藏並按順序顯示div（只有那些有子項的），有點像假動畫Gif，永遠循環。用javascript/jquery僞裝一個Gif

我嘗試這樣做：

function autoPlay() { 
    $('.conP').each(function(){ 
    if ($(this).children().length > 0) { 
     setInterval(function(){ 
     $(this).show().delay('100').hide(); 
     },300); 
    } 
    }); 
}

這是不返回任何錯誤，但它沒有隱藏或顯示任何帶有class =「CONP」的div的。

任何有關我在做什麼錯的建議/我該如何改進？

來源

2013-06-12 EmmaGamma

這裏的的jsfiddle： http://jsfiddle.net/reveries/gmdDk/ – EmmaGamma

試試這個 -

function autoPlay() { 
    $('.conP').each(function(){ 
    if ($(this).children().length > 0) { 
     var $that = $(this); 
     setInterval(function(){ 
     $that.show().delay('100').hide(); 
     },300); 
    } 
    }); 
}

來源

2013-06-12 22:05:35

你是完全正確的，因爲是NikitaBaksalyar，「這」不是選擇各CONP，但現在的問題是，它實際上沒有動畫：/它只是設置所有div與conP同時顯示：none或display：block。 – EmmaGamma

你能創建一個http://jsfiddle.net來顯示你的問題嗎？ –

這就是我現在正在做的，謝謝你的幫助！ – EmmaGamma

不知道這是一個偉大的理念來經營循環中的時間間隔，但我猜問題是間隔函數內部範圍：

function autoPlay() { 
    $('.conP').each(function(i, elem){ 
     if ($(elem).children().length) { 
      setInterval(function(){ 
       $(elem).show().delay(100).hide(); 
      },300); 
     } 
    }); 
}

來源

2013-06-12 22:05:57 adeneo

您有一個在您的setInterval關閉中錯誤地提及this。請參閱JavaScript Garden中的「How this works」。

在你的情況，你應該保存參考this在一個變量：

$('.conP').each(function() { 
    var $element = $(this); 

    setInterval(function() { 
     $(element).show().delay('100').hide(); 
    }, 300); 
});

或者，更好的使用傳遞給each的第一個參數，這是在這種情況下，等於$(this)。

來源

2013-06-12 22:08:49 NikitaBaksalyar

我真的很感激所有幫助傢伙，我似乎已經想通了動畫部分：

setInterval(function() { 
    autoPlay(); 
},120); 

function autoPlay() { 
    var backImg = $('#outterLax div:first'); 
    backImg.hide(); 
    backImg.remove(); 
    $('#outterLax').append(backImg); 
    backImg.show(); 
}

通過隱藏取其格是第一次，從-再追加它刪除它放回，包含div ，並顯示新的第一個div，它動畫很好！

來源

2013-06-12 23:50:23 EmmaGamma

用javascript/jquery僞裝一個Gif

回答

相關問題