多个加载调整器的图像列表

尝试删除加载动画时，单个图像已完成加载，但已遇到问题。加载第一张图片后加载动画会被删除，而不是在加载特定图片时单独加载。多个加载调整器的图像列表

我想有一个图像的行，每个都有自己的加载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);});     
});

来源

2012-09-14 M_M

你只需要改变淡出了一下：

$('img').bind('load', function() { $(this).fadeIn(1500).prev().fadeOut(2000);});

这变淡德形象和获取是面前的元素，淡化出来。

来源

2012-09-14 16:04:26 rcdmk

试试这个：

$(document).ready(function(){ 
    $('img').css({'display':'none'}); 
    $('img').bind('load', function() { 
     $(this).fadeIn(1500); 
     $(this).prev('.img-loading').fadeOut(2000); 
    });     
});

在你的代码分别致电与类.img-loading所有元素淡出时您需要指定相对于正在加载的图像的那个。

来源

2012-09-14 16:03:02 j08691

尝试的each()功能

$('img').each(function(){ 
     var container = $(this).parent(); 
     $(this).bind('load', function() { $(this).fadeIn(1500);$('.img-loading', container).fadeOut(2000);}); 
});

这就是相当粗糙，可能需要精炼，但基地的概念是存在的。

来源

2012-09-14 16:05:05 kingkode

多个加载调整器的图像列表

回答

相关问题