修复垂直滚动条位置第二行在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）？

回答

相关问题