Question

您好我使用this wonderful jQuery slider构建了一个大型图库，并且根据我所包含的幻灯片数量，初始加载时间非常重要，我想知道是否有一个简单的方法让我集成一个基本的加载动画div - 例如。带有“loading gallery ..”文本的微调器 - 滑块完全加载后隐藏？我很好奇我是否有办法让DOM首先显示加载div，并且可能使用滑块的回调函数之一 - 或者通过jQuery（？） - 在完全初始化时拉出div？最终，我希望在5-10秒内向用户显示脚本，标记和缩略图加载到浏览器中的内容（我正在使用延迟加载功能，所以它至少不是最初加载所有完整的 - 尺寸图片。）

感谢您的任何见解。

Answer 1

您可以按照以下方式执行此操作，但请记住未经测试。

<强> JS

$(window).load(function(){
   // initialize slider.
   // remove loading_image image as below
   $('img#loading_image').remove();
});

<强> HTML

<div><img src="loading.jpg" alt="" id="loading_image" /></div>
<div><img src="image.jpg" class="hide" alt="" /></div>
<div><img src="image.jpg" class="hide" alt="" /></div>
<div><img src="image.jpg" class="hide" alt="" /></div>
<div><img src="image.jpg" class="hide" alt="" /></div>

<强> CSS

#loading_image { display: block; other css code. }
.hide { display: none; }

希望这将有助于此代码执行的操作，直到页面完全加载它将隐藏除加载图像之外的所有滑块图像，并且一旦页面完全加载了所有图像，它将根据您的需要工作。

在初始化jQuery图像滑块时显示加载器

1 个答案: