网页内容在加载时闪烁/移动

时间:2013-11-14 14:21:22

标签: html css loading flicker

我最近控制了一个大型网站。我的问题是,有时候,在某些浏览器/计算机上,当你在页面之间导航(或点击刷新)时,整个内容稍微向右加载,然后半秒后,跳回到它应该的左边。在一秒钟内,距离只有5毫米左右,但是很明显。

有用的知识:

这是一个wordpress网站,但只有基本功能 - 菜单包含jQuery但是没有其他javascript来阻止加载。

所有内容都包含在使用

居中的容器中
{margin: 0 auto;}

有几个CSS样式表,并且已经多次定义了一些主要标签,例如容器 - 我甚至发现其中两个之间的宽度之间存在差异,但是当修复时,一切仍然会跳跃。

侧面没有图像因慢速加载而导致图像跳跃。

如果内容大于屏幕高度,内容只会跳转 - 也就是说,它会离开屏幕。

内容会随旧计算机一起跳转,但不会在同一网络和连接上使用我的新计算机跳转。

在较旧的计算机上,内容将与IE 10一起跳转,但在将IE10置于兼容模式时则不会。

我担心我没有获得链接到网站的权限,所以我试图把我所知道的一切都放在这里。我知道这会让事情变得更加艰难,但是任何能让我走向正确方向的指针都会有所帮助!

更新!

滚动条是问题 - 我使用了这个帖子的答案:Making the main scrollbar always visible

所有的跳跃都停止了!

1 个答案:

答案 0 :(得分:1)

你应该简化问题,除去“事物”,直到你把它隔离开来。

如果您没有预生产或开发环境来测试,请复制仍存在问题的页面。然后开始删除东西。如果任何div需要一些内容,那么布局是稳定的,用简单的文本或图像替换任何动态或复杂的内容。

如果问题似乎已解决,删除某些东西并不认为你得到它,撤消你刚刚做的事情,所以它仍然失败并继续删除与问题无关的部分或功能。 当你有一个仍然失败的最小例子时,更容易找出问题是什么,或者如果不在这里发布示例,那么我们可以提供帮助。