Javascript 滑块在正确渲染之前加载每张幻灯片

如果你看我下面的网址，在一个可能不是很快的连接上。你会注意到顶部的滑块，在垂直列表中加载每个单独的幻灯片（占用大约1000px的空间），然后捕捉到它应该呈现的方式，这就像一个标准的滑块；一次显示和滑动一张幻灯片

有人对如何正确加载滑块有什么建议吗

在线站点>>

---感谢大家的指点，我想我需要找到一个脚本，让幻灯片隐藏起来，直到滑块/页面完全加载，然后再展示它们

相关jQuery:

jQuery（文档）.ready（函数（$）{
$（“#照片旋转器”）.tabs（{fx:{opacity:{toggle:}}）.tabs（“旋转”，6000）；
});

相关加价：

您的代码有点混乱，问题没有帮助，但与您的问题部分相关，其中内容如下：

你会注意到顶部的滑块，在捕捉到它应该呈现的方式之前，在垂直列表中加载每个单独的幻灯片（占用大约1000px的空间）

您可以用div包装整个滑块内容，并给出
溢出：隐藏防止页面加载上+/-1000px的高度：

CSS

#photo-rotatorWrapper {
    width: 960px;
    height: 400px;
    margin: 0 auto;
    overflow: hidden;
}

HTML

<div id="photo-rotatorWrapper">
  <div id="photo-rotator">
    ...
  </div>
</div>


...

注意：
您可能需要为该包装设置其他
CSS
声明，以便在当前HTML结构中保持正确的位置。
您的jquery看起来像什么。加载页面后是否调用滑块？只是在上面添加了相关的jQuery。我认为这意味着页面加载，对吗？你也需要添加相关的HTML，或者只是jsFiddle。谢谢-添加，让我知道想法既然这与PHP无关，为什么你要显示它而不是实际的HTML输出？谢谢，是的-这也是我一直在尝试的解决方案。我试着在所有的标记周围添加一个包装，我试过，使用我已经编写的div容器，我尝试用隐藏在PHP include for the slider周围的溢出来包装定义高度和宽度的div，它将滑块推到我的页面内容的下方和后面，我还没有找到一个解决方案使其呈现在正常的位置。我已经设法使用这个概念，并在页面空白处留有空白滑到它应该在的地方。尽管如此，它仍然负载奇怪~这将是解决方案，因为我没有更多的时间来追求。谢谢你。
#photo-rotatorWrapper {
    width: 960px;
    height: 400px;
    margin: 0 auto;
    overflow: hidden;
}

<div id="photo-rotatorWrapper">
  <div id="photo-rotator">
    ...
  </div>
</div>