元素定位不正确

Question

我第一次去this page时，幻灯片放映的定位（使用JQuery循环插件开发）都搞砸了，就像这样：

如果我然后刷新页面，它会正确显示，如下所示：

如何在第一次查看时确保此页面正确显示？与其他浏览器相比，Chrome使用错误的布局似乎更常见，但正如您从上面的屏幕截图中看到的那样，其他浏览器也会出现这种情况。

谢谢， 唐

Answer 1

为图片添加width和height属性。

我猜测JavaScript在加载图像之前激活，然后进行几次快速计算以获得所需的尺寸，并将它们锁定到位;所有这一切都发生在加载图片之前，并且由于没有width或height属性，因此尺寸会逐渐消失。在重新加载时，图像来自浏览器缓存，因此在运行JavaScript时会知道维度。

您的JavaScript在DOM准备就绪时运行，而不是在每个事物都已完全解析和加载时运行。您还可以尝试将幻灯片绑定到load事件，而不是document.ready。

您在Chrome中看到的这一点比其他浏览器更多，因为Chrome非常快，并且会放大时间问题。