Question

This page在旋转木马中显示了一组图像。轮播由jQuery infinite carousel plugin提供。目前，插件和调用它的JS代码都加载在<head>。

中

在旋转木马代码开始之前，会有一些没有样式的内容，只显示图像本身。我能做些什么来防止这种情况，例如隐藏图像，直到carosel初始化？

FOUC在IE中特别糟糕，但也出现在Firefox中。

Answer 1

您可以在css中为内容设置display:none，然后在轮播代码启动之前使用javascript将其删除。

Answer 2

如果您在浏览器上停用了javascript，则可以看到“flash”的外观。在禁用JS的情况下确保页面至少始终“可用”是个好主意。将此css添加到#carousel将会起到作用：

overflow: hidden;
width: 615px;
height: 270px;
border: 2px solid #aaa;