jQuery 实现图片的依次加载图片功能

前端之家收集整理的这篇文章主要介绍了jQuery 实现图片的依次加载图片功能前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

css代码

js代码

0){ //create the UL element var ul=$('
    '); //append to div#wrapper $(ul).appendTo($('#wrapper')); //load the first image LoadImage(0,max); } //在LoadImage方法中,循环遍历所有的图像,对每个图像创建li元素 function LoadImage(index,max){ if(index方法为li元素增加了css样式,即加上了loading的gif背景。 var list=$('
  • ').attr('class','loading'); //把li添加到ul元素中 $('ul#portfolio').append(list); //获取当前的li元素 var curr=$("ul#portfolio li#portfolio_"+index); //创建图像元素 var img=new Image(); //加载图像 $(img).load(function(){ $(this).css('display','none'); $(curr).removeClass('loading').append(this); $(this).fadeIn('slow',function(){ //采用回调函数方法,在当前元素成功执行fadeIn方法之后 再去调用下一个元素的LoadImage方法,这样就能实现多个图像的顺序加载了。 LoadImage(index+1,max); }); }).error(function(){ $(curr).remove(); LoadImage(index+1,max); }).attr('src',images[index]); } } })

以上所述是小编给大家介绍的jQuery 实现图片的依次加载图片。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持

原文链接:https://www.f2er.com/jquery/38064.html

猜你在找的jQuery相关文章