運行在元素的高度

當用戶滾動某個元素時，我需要運行一些JavaScript。在這種情況下，該元素是<span class="accomp"></span>。我放在一起處理這個腳本作品時提供的像素值，但該值可能不符合這取決於用戶的屏幕分辨率，瀏覽器頁面上的正確的區域，基於等運行在元素的高度

$(window).scroll(function() { 
    if ($(window).scrollTop() === $(document).height() - $(window).height() - $("span.accomp").height()) { 
     meSpeak.speak('hello world', { pitch: 10, speed: 100 }); 
    } 
});

像素值腳本將使用像素而不是$("span.accomp").height()

來源

2014-02-09 Ronald Snew

使用jQuery的offset()。

獲取匹配元素集合中第一個元素相對於文檔的當前座標。

var spoken = false; 

$(window).scroll(function(){ 
    if(spoken) return; 

    var scrollTop = $(window).scrollTop(); 
    var elementTop = $("span.accomp").offset().top; 

    if(scrollTop >= elementTop){ 
     meSpeak.speak('hello world', { pitch: 10, speed: 100 }); 
     spoken = true; 
    } 
});

來源

2014-02-09 17:46:28 mattsven

謝謝。這可以解決我遇到的另一個解決方案中遇到的問題，在這個解決方案中，「hello world」會重複出現，直到您移出span.accomp下面的區域。但是，當用戶窗口的頂部到達元素時，這會激活。如果可能的話，當用戶第一次遇到元素時，劇本可以被激活，即：他們的窗口底部到達跨度？ –

不要緊，因爲我已經設法通過將比較逆轉爲小於 –

而自己做到這一點，但是，如果您嘗試通過更改變量來觸發它們全部在多個跨度中使用此功能一旦。 –

需要觸發事件時，滾動頂部達到滾動特定元素。

var elementTop = $(".accomp").offset().top;  
$(document).scroll(function(){ 
    if($(this).scrollTop() > elementTop) 
    { 
     //add your code here 
    } 
});

注：請確保您使用的類此元素，如果有與此類結果的多個元素可能不會如預期的那麼代替類使用的ID。

來源

2014-02-09 17:48:18

'null'不是一個對象（評估'$（「.correct」）。offset（）。top'） –

plz請確保使用此特定類的元素可用，請嘗試使用控制檯。建議將其更改爲id –

運行在元素的高度

回答

相關問題