如何獲得div的真正滾動高度（例如，內部文本大小）

Question

我試圖做一個自動滾動div，當它到達最後時，它會到達頂部。但它不工作...

function scrollPannel() 
{ 
    var pannel = document.getElementById('pannel'); 
    if (typeof scrollPannel.count == 'undefined') 
    { 
     scrollPannel.count = 0; 
    } 
    else 
    { 
     scrollPannel.count += 2; 
    } 
// trouble is here 
    if ((scrollPannel.count - pannel.scrollHeight) > pannel.clientHeight) 
    { 
     scrollPannel.count = 0; 
    } 
    pannel.scrollTop = scrollPannel.count; 
    setTimeout('scrollPannel()', 500); 
} 

HTML：

<div id='pannel' style="height:200px;overflow:auto" onmouseover="sleepScroll()"> 
    <p>...</p><!-- long text --> 
</div> 

，後，我需要找到如何停止滾動時 「的onmouseover」 occures。

編輯：我沒有清楚地解釋這個問題。事實上，我已經試過類似：

if (scrollPannel.count > pannel.scrollHeight) 
{ 
    scrollPannel.count = 0; 
} 

的問題是，scrollHeight屬性似乎比格內的文字更大。所以這會讓很多時間回到頂端。

所以我需要一個元素屬性，我可以使用該值與我的count變量進行比較。然而，我不太瞭解Javascript，也找不到任何東西。我希望它跟我想到的一樣簡單。

Answer 1

你可以嘗試使用scrollHeight屬性。

https://developer.mozilla.org/en-US/docs/Web/API/element.scrollHeight

Answer 2

的解決方案，我有涉及jQuery的，希望這不是一個問題。

的JavaScript：

var timeout; 
function scrollPannel() 
{ 
    var divHeight = $("#pannel").height()/2; 
    var scrollCount = $("#pannel").scrollTop(); 
    var scrollHeight = $("#inside").height() - 20 - divHeight; 
    scrollCount += 2; 

    if ((scrollCount - scrollHeight) > 0) 
    { 
     scrollCount = 0; 
    } 
    $("#pannel").scrollTop(scrollCount); 
    timeout = window.setTimeout(scrollPannel(), 100); 
} 

function scrollStop() { 
    window.clearTimeout(timeout); 
} 

HTML：

<div id='pannel' onmouseover="scrollStop();" onmouseout="scrollPannel();"> 
    <p id="inside"></p><!-- long text --> 
</div> 

說明： jQuery的內部元素<p>的.height()給我們你要找的實際高度，但它不是足夠達到底部，因爲那發生在我們到達元素的高度之前。一個小調查顯示，scrollTop()的「頂部」大約在原來的div的高度的一半。您可能需要與divHeight一起玩，以獲得您要查找的確切結果。

當然，我還包括一個停止和繼續滾動的方法。

祝你好運！

Answer 3

嘗試：

// calculate max scroll top position (go back to top once reached) 
var maxScrollPosition = element.scrollHeight - element.clientHeight; 
// example 
element.scrollTop = maxScrollPosition; 

這應該做你所需要的。