js固定侧边栏

2025-04-03 20:36:13

1、首先写好3个div供页面滑动和一个侧边栏盒子,并写好样式

js固定侧边栏

2、接着获取main和侧边栏盒子,并添加滚动事件

js固定侧边栏

3、然后当页面滑到main盒子时,让侧边栏为固定定位,并且侧边栏上边距为main上方的盒子及间距

js固定侧边栏

4、如果鼠标滑动不是main盒子在最上方,那么就让侧边距和样式中设置的相同

js固定侧边栏

5、最后打开浏览器滑动查看侧边栏效果

js固定侧边栏

6、总结:对页面添加滚动事件,当滚动距离超过设置大小就使侧边栏为固定定位并设置它的上边距,否则就为样式的设置相同

js固定侧边栏
声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢