您现在的位置是:网站首页> 编程资料编程资料
js实现淘宝固定侧边栏_javascript技巧_
2023-05-24
432人已围观
简介 js实现淘宝固定侧边栏_javascript技巧_
本文实例为大家分享了js实现淘宝固定侧边栏的具体代码,供大家参考,具体内容如下
1.实现效果:

当页面运行到banner区域时,右边侧边栏改为固定定位,当页面运行到主体区域时,右边侧边栏显示返回到顶部。
2.思路:
(1)给document加scroll事件。
(2)获取页面被卷去的部分用window.pageYOffset.
(3)不断判断页面滚动了多少。计算右边侧边栏应该待的位置。
3.代码:
pink老师用了固定定位fixed(固定定位是相对于窗口的距离),我做的还是用绝对定位(绝对定位是相对于父元素来说的,即document),都是可以实现的。
Document 头部区域头部区域尾部区域
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
您可能感兴趣的文章:
