修復垂直滾動條位置第二行在div（cshtml）？

我有一個div滾動條，顯示15個月，每行3分鐘，當頁面加載時，我想修復滾動條位置到第二行，如我的截圖所示。如滾動條應該被固定在我的屏幕截圖中顯示的位置，而不是頂部。此要求的原因是我們顯示前3個月，但用戶應該看到頁面加載時的當前月份。我希望我已經說得很清楚 enter image description here 修復垂直滾動條位置第二行在div（cshtml）？

我使用

<div id="key_dates" style ="overflow:scroll;width:960px;height:500px">

你們能幫幫？

感謝，阿達什訥

來源

2011-11-03 KeenUser

您需要使用JavaScript這樣的：

<!-- 
    Place this script before closing </body> tag so that 
    DOM (HTML elements tree) is already built when the script is running 
--> 
<script> 
// create a closure to not pollute global scope 
!function() { 
    // cache reference to keyDates element 
    var keyDates = document.getElementById('key_dates'); 
    // set scroll to the height of one row 
    keyDates.scrollTop = 150; // substitute `150` with height of one row 
}(); 
<script>

Here是element.scrollTop

的文檔

如果您正在使用jQuery，你像這樣做（和here是文檔）;

<script> 
$('#key_dates').scrollTop(150); 
</script>

使用jQuery的例子：http://jsfiddle.net/gryzzly/CjdwX/

來源

2011-11-03 06:29:29

基於高度的調整似乎更適合我，因爲我沒有真正控制行。但是，當我在jquery $（'＃key_dates'）中添加了這個代碼片段時，scrollTop（150）;滾動條的位置似乎根本沒有改變。我可能在這裏錯過了什麼？ – KeenUser

似乎適用於我：http://jsfiddle.net/gryzzly/CjdwX/ –

注意到我們更改了父容器，容器，應用了'overflow：scroll'的元素的'scrollTop' –

我似乎不能正確的jsfiddle證明這一點，但如果here is a sample of code您在瀏覽器中測試它其中工程。在每一行使用錨點，我們可以使用href或url將窗口錨定到指定的位置。

例如，如果您在www.address.tld/calendar處執行此代碼以顯示第二行，則應輸入www.address.tld/calendar#row2。

您只能在第二行使用錨點，並且可以根據需要靜態或編程地放置它。這是一個非常簡單的解決方案，但有些人不喜歡網址中的散列和錨點名稱。它不會打擾我。

來源

2011-11-03 06:30:16

你可以這樣演示它：http://fiddle.jshell.net/PfLS3/2/show/light/#row2 –

@gryzzly完美！感謝指針。此外，上面的很好的答案。 –

修復垂直滾動條位置第二行在div（cshtml）？

回答

相關問題