我正在使用 Typed.js 将文本行动态添加到 div。几秒钟后,固定高度的 div 会出现一个滚动条。我想在不编辑我的 Typed.js 库代码的情况下不断添加内容时,让滚动条滚动到底部。
我能够用代码完成这个:
window.setInterval(function() {
var elem = document.getElementById('scrollBottom');
elem.scrollTop = elem.scrollHeight;
}, 500);
但是,如果用户试图向上滚动,代码显然会强制 div 滚动回底部。相反,我希望它允许用户根据需要自由滚动(但默认情况下,无需用户交互,滚动到底部)。
陷阱:我无法在每次添加新代码行时都执行滚动;本质上,我不知道什么时候会添加它。这就是为什么我最初想到使用频繁间隔(如上所示)。
如果用户点击div的滚动条,有没有办法结束上述功能?
最佳答案
简单。像这样:
var youInterval;
function startInterval(){
youInterval = setInterval(function() {
var elem = document.getElementById('scrollBottom');
elem.scrollTop = elem.scrollHeight;
}, 500);
}
//If user scrolls, stop interval
document.addEventListener('scroll', function (event) {
if (event.target.id === 'scrollBottom') { // or any other filtering condition
clearInterval(youInterval);
}
}, true /*Capture event*/);
//And start it whenever you need
startInterval();
关于javascript - Typed.js - 除非用户与滚动条交互,否则随着 div 大小的增加,保持 div 滚动到底部?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44476863/