赞
踩
问题分析:
页面滚动到一定高度时,悬停导航栏,fixed固定定位,但当页面滑动到固定定位临界点时,页面会抖动,产生的原因是,class sticky在临界点会添加-移除,产生页面抖动效果,这时加个定时器可解决页面抖动问题。
- // 滚动条滚动高度
- let scrollTop = document.documentElement.scrollTop || document.body.scrollTop || 0
- let toolbar = null
- if (!toolbar) {
- toolbar = document.querySelector('.l-editor-toolbar')
- }
- if (toolbar) {
- if (scrollTop > 158) {
- let timer = setTimeout(() => {
- clearTimeout(timer)
- toolbar.className = 'l-editor-toolbar sticky'
- }, 5)
- } else {
- let timer = setTimeout(() => {
- clearTimeout(timer)
- toolbar.className = 'l-editor-toolbar'
- }, 5)
- }
- }

- .sticky{
- position:fixed;
- top:100px;
- z-index: 1;
- }
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。