尝试在单个图像完成加载但遇到问题时删除加载动画。加载第一个图像后移除加载动画,而不是在加载特定图像时单独移除。
我想要一排图像,每个图像都有自己的加载 giff,有什么想法吗?
这是我到目前为止想出的......
.img-container{
float:left;
width:500px;
height:500px;}
.img-loading{
position:absolute;
background:url('loading.gif') center center no-repeat;
width:500px;
height:500px;}
<div class="img-container"><div class="img-loading"></div><img src="example.jpg" height="500" width="500" border="0"/></div>
<div class="img-container"><div class="img-loading"></div><img src="example2.jpg" height="500" width="500" border="0"/></div>
<div class="img-container"><div class="img-loading"></div><img src="example.jpg3" height="500" width="500" border="0"/></div>
$(document).ready(function(){
$('img').css({'display':'none'});
$('img').bind('load', function () { $(this).fadeIn(1500);$('.img-loading').fadeOut(2000);});
});
最佳答案
你只需要稍微改变一下淡出:
$('img').bind('load', function () { $(this).fadeIn(1500).prev().fadeOut(2000);});
这会淡入图像并获取它之前的元素并将其淡出。
关于jquery - 图像列表的多个加载微调器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12428051/