Question

我的问题基本上可以追溯到：Scrolling Overflowed DIVS with JavaScript

我想知道如何在不使用jQuery的情况下做到这一点。任何帮助，将不胜感激。提前谢谢！

另外：在链接的问题中，每次执行代码时它是否将div向下滚动一个完整的滚动高度？如果是这样，如何使用鼠标位置向下滚动？换句话说，一旦我将鼠标移动到div的底部，我怎么能让div继续向下滚动，并且可能让鼠标光标保持在同一位置（这个条件不需要但是赞赏）？提前再次感谢！

Answer 1

我相信我确切地知道如何实现您正在寻找的效果。我只是使用onmouseover和onmouseout事件来启动和停止JavaScript间隔机制，该机制使用有问题的div的scrollTop属性来模拟滚动。给它一个旋转：

<script>
var interval, cur_scroll = 0;
    
function scroll()
{
  interval = setInterval(function()
  {
    cur_scroll += 2;
    document.getElementById('testDiv').scrollTop = cur_scroll;
  }, 40);
}
     
function stop()
{
  clearInterval(interval);
}
    
document.getElementById('testDiv').setAttribute('onmouseover', 'scroll()');
document.getElementById('testDiv').setAttribute('onmouseout', 'stop()');
</script>

<style>
#testDiv
{
  width: 100px;
  height: 100px;
  overflow: hidden;
  border: 1px solid #000000;
}
</style>

<div id="testDiv">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec interdum libero sit amet diam. In hac habitasse platea dictumst. Cras eleifend tortor scelerisque mi viverra malesuada.</div>

使用Javascript更多滚动溢出的Div

1 个答案: