滚动到固定标题顶部时延迟重新绘制
约瑟夫·凯西
示例：http：//www.arkansasmatters.com/beta/news/politics
我有一个简单的JavaScript，可在网站上保留固定的标题。向上滚动时，页眉在极少数情况下会显示此红色条，如果继续向上滚动，该条会消失。
function stickynav() {
var win = $(window),
nav = $('#primary_nav_wrap'),
pos = nav.offset().top,
sticky = function () {
win.scrollTop() > pos ? nav.addClass('sticky') : nav.removeClass('sticky');
};
win.scroll(sticky);
}
该脚本是否会导致以下原因？
- 向上滚动空白栏
- 向下滚动时闪烁
附加信息：
- 浏览器：谷歌浏览器
- 用户代理：Mozilla / 5.0（Windows NT 6.1; WOW64）AppleWebKit / 537.36（KHTML，例如Gecko）Chrome / 37.0.2062.124 Safari / 537.36
或者：是否有另一个我错过的类似于IE7 +跨浏览器的解决方案？
更新
如果用户快速向上和向下滚动，此问题是可复制的。一遍又一遍地调用JS函数。
阿蓬扎尼
这个解决方案可以解决我在带有JS / CSS手风琴插件的Chrome v38 +中遇到的类似问题。我相信，只有在JS发起CSS更改后，这种更改才会发生，并且这种更改发生得足够快，以至于Chrome的重绘功能落后了。
使用translateZ（0）将推动浏览器使用GPU加速来加速CSS转换。以下是几篇更详细的文章：
http://www.smashingmagazine.com/2012/06/21/play-with-hardware-accelerated-css/
http://blog.teamtreehouse.com/increase-your-sites-performance-with-hardware-accelerated-css
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
滚动时更改固定标题
- 2
滚动内容时如何固定标题
- 3
滚动到固定标题的锚点位置
- 4
滚动过去的元素时更改固定标题的背景
- 5
滚动时的HTML固定标题栏
- 6
表格可滚动时无法固定标题
- 7
滚动过去的元素时更改固定标题的背景
- 8
滚动时在元素上覆盖固定标题
- 9
滚动上方的Div时固定标题
- 10
固定标题隐藏内容顶部
- 11
如何滚动到带有附加空格的HTML id标签（固定标题）？
- 12
UITableview在重新加载时滚动到顶部
- 13
滚动显示多个固定标题
- 14
滚动显示多个固定标题
- 15
左侧的固定侧边栏菜单和顶部的固定标题
- 16
标题菜单未完全隐藏时，粘性菜单快速跳至顶部或滚动到顶部
- 17
标题菜单未完全隐藏时，粘性菜单快速跳至顶部或滚动到顶部
- 18
向下滚动时显示在固定标题上方的图像和文本
- 19
向下滚动隐藏固定标题，向上滚动显示并悬停
- 20
防止在添加固定位置时页面滚动到顶部
- 21
平滑滚动到顶部，然后固定/固定浮动元素
- 22
在Bootstrap 3中使用固定标题（navbar）向下滚动表格行时，如何将表格标题（thead）粘贴在顶部？
- 23
切换时将div滚动到顶部（关闭或重新打开）
- 24
重新渲染组件时如何防止自动滚动到顶部？
- 25
切换时将div滚动到顶部（关闭或重新打开）
- 26
重新加载网格存储时如何停止滚动到顶部
- 27
具有可滚动行和固定标题的表
- 28
CSS：具有多个表头的固定标题的滚动表
- 29
具有固定标题的UWP垂直滚动条
我来说两句