在jQuery中使用「this」在.next（）之後調用

我正在製作一個簡單的滾動圖像循環，第一個圖像穿過屏幕很好，但沒有任何後面，我是否正確使用「this」？代碼：在jQuery中使用「this」在.next（）之後調用

var width = $(window).width(); 
var height = $(window).height(); 

var size = (height + width)/2; 

$(document).ready(function() 
{ 
    $('#pictureFrame').children('img').each(function(){$(this).css('left', '100%')}); 
}); 
window.onload = function(){startSlideshow($('#pictureFrame > img'))}; 
function startSlideshow(myobj) { 
    $(myobj).next().animate({left: "-=" + (width + 2000)},{ 
     duration: 30000, 
     queue: false, 
     easing: 'linear', 
     complete: function() { 
      $(myobj).css('left', '100%') 
     } 
    }); 
    time = ($(this).width()* 10)/(width + 2000); 
    setTimeout(startSlideshow($(this)),time); 
}

HTML：

<div id="pictureFrame">  
    <img class="slideshow" src="img1.jpg"> 
    <img class="slideshow" src="img2.jpg"> 
    <img class="slideshow" src="img3.jpg"> 
    <img class="slideshow" src="img4.jpg">  
</div>

來源

2013-12-15 Craig Lafferty

如果你使用：'startSlideshow（$（'＃pictureFrame> img：first'））'???在你的代碼中，'$（myobj）'是所有圖像，而不僅僅是一個。而且你需要爲超時情況提供上下文。順便說一句，你的超時語法在這裏是錯誤的 –

'startSlideshow'有'window'作爲它的'this'對象。這可能不是你想要的。 –

我的印象是.next只有在包含多個兄弟的對象上調用時纔有效。那是錯的嗎？ –

我覺得這樣的事情是更接近你想要的東西：

window.onload = function() { 
    startSlideshow($('#pictureFrame > img:first')) 
}; 

function startSlideshow(myobj) { 
    myobj.animate({left: "-=" + (width + 2000)},{ 
     duration: 30000, 
     queue: false, 
     easing: 'linear', 
     complete: function() { 
      $(myobj).css('left', '100%') 
     } 
    }); 
    var next = myobj.next(); 
    if (!next.length) { 
     next = myobj.siblings().first(); 
    } 
    time = ($(this).width()* 10)/(width + 2000); 
    setTimeout(function() { 
     startSlideshow(next) 
    }, time); 
}

到startSlideshow每個呼叫轉到在DIV下一張圖片。當它用完時，它會回到第一個。

來源

2013-12-15 13:52:44 Barmar

由於某些原因，這將不會循環第二次，並且'setTimeout（）'不起作用。即使我使用像5這樣的整數而不是'time'，圖像也會同時開始移動。 –

由於某種原因，它剛剛開始工作;然而，循環只播放一次。如果在動畫再次被調用之前尚未調用第一個動畫的回調，那麼回調就會失效並且只是再次跳到動畫？ –

我對jQuery動畫並不太熟悉，所以我不知道如果您嘗試同時對同一個元素進行兩次動畫，會發生什麼情況。它似乎應該是某種衝突。 – Barmar

在jQuery中使用「this」在.next（）之後調用

回答

相關問題