$(document).ready 或 $(window).load 用于 jQuery 循环答案

【问题标题】：$(document).ready or $(window).load for jQuery cycle$(document).ready 或 $(window).load 用于 jQuery 循环
【发布时间】：2012-06-16 01:35:22
【问题描述】：

我正在使用 Jquery Cycle 滚动图像，我目前正在使用 $(document).ready，问题是图像加载了一半，循环效果开始了，

$(document).ready(function(){
$('#gallery').cycle({
        fx: 'scrollLeft,scrollLeft,scrollLeft,scrollLeft' ,
        speed:  1000,
        pause:   3
         });
 });

我应该使用 $(window).load 在开始效果之前等待所有图像加载吗？这样做的问题是图像将堆叠在另一个之上。

所以请为我的问题提出解决方案

【问题讨论】：

对于 ID 为 gallery 的 div 制作样式 display: none 。如果这不能解决问题，则添加 js 代码$("#gallery").show();。在循环代码之前和之后尝试它并查看结果。你不应该使用 $(window).load 循环。
stackoverflow.com/questions/1430854/…

标签： jquery jquery-cycle

【解决方案1】：

#gallery { width: SOMEDEFAULTWIDTH; height: SOMEDEFAULTHEIGHT; } 
#gallery img { display:none; }

为避免图像堆叠在其他图像之上，display: nonejquery 循环插件将在启动时显示它们。

【讨论】：

【解决方案2】：

您可以使用此库来帮助您加载所有图像，然后在需要时加载它们

http://thinkpixellab.com/pxloader/

【讨论】：

【解决方案3】：

您还可以使用在整个内容加载后触发的 jQuery(window).load() 事件。

这样使用。

jQuery(window).load(function($) {

 $('#gallery').cycle({
    fx: 'scrollLeft,scrollLeft,scrollLeft,scrollLeft' ,
    speed:  1000,
    pause:   3
     });

});

希望对你有帮助。

【讨论】：