如何解决我需要将侧边栏滚动与页面滚动同步,以便在滚动页面时侧边栏随之滚动
我需要将侧边栏滚动与页面滚动同步,以便在滚动页面时侧边栏随之滚动。
棘手的部分是页面内容和侧边栏内容的高度可以不同,但是侧边栏通常较短,因此我需要根据它们的高度来计算滚动速度,但是我不知道该怎么做。目标是“平滑”侧栏滚动,以便在页面完全向下滚动时,滚动条一直滚动
我的代码在https://codepen.io/mariforme/pen/wvGyddz
HTML
let sidebar = document.querySelector('#sidebar');
let wrapper = document.querySelector('#wrapper');
let lastS = 0;
let thisS = 0;
wrapper.addEventListener('scroll',function() {
lastS = thisS;
thisS = this.scrollTop;
sidebar.scrollTop += (thisS - lastS) - 1;
console.log("SIDEBAR: ",sidebar.scrollTop,"WRAPPER: ",wrapper.scrollTop);
},false);
CSS
<div id="wrapper">
<div id="content">
<h3>Main content</h3>
<p>... CONTENT...</p>
</div>
</div>
<div id="sidebar">
<h3>Sidebar</h3>
<p>...CONTENT...</p>
</div>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。