本篇文章给大家带来的内容是关于jquery中图片无序预加载的实现以及使用方法，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。
/图片无序预加载(function($){function Preload(imgs,fns){this.imgs=(typeof imgs==="string")?[imgs]:imgs;this.fns=$.extend({},Preload.fns,fns);//把fns 覆盖到Preload上 然后添加到{}返回if(this.fns.loadMethod=="unorderload"){//是无序 还是有序this._unorderload();}else{this._orderload();}}Preload.fns={loadMethod:null,//有序还是无序的方式eachLoadImg:null, //每张图片加载完所执行的函数allLoadImg:null //所有图片加载完所要执行的函数}Preload.prototype._orderload=function(){var imgs=this.imgs,len=imgs.length,fns=this.fns,num=0;function load(){var imgObj=new Image();$(imgObj).on("load error",function(){fns.each && fns.each(); //存在 才会执行if(num 使用方法
nbsp;html> 有序预加载 *{margin: 0; padding: 0;} img{ width:100%; vertical-align:top; } .imgBox{ width:500px; margin:100px auto; } #prevImg, #nextImg{ width:60px; font-size:15px; height:30px; line-height:30px; text-align:center; background: #686868; position:absolute; color:#000; text-decoration:none; margin-top:-50px; } #prevImg{ left:40%; } #nextImg{ left:55%; } $(function(){ var imgs=["img/0.jpg","img/1.jpg","img/2.jpg","img/3.jpg","img/4.jpg","img/5.jpg","img/6.jpg","img/7.jpg"]; var len=imgs.length; var index=0; $.preload(imgs,{}); $("#control-img-btn").on("click","a",function(){ if($(this).hasClass("prevImg")){ index=Math.max(0,--index); //上一张 } else{ index=Math.min(len-1,++index);//下一张 } $("#imgBox img").attr("src",imgs[index]); }); }); ![jquery中图片无序预加载的实现以及使用方法]()
![jquery中图片无序预加载的实现以及使用方法]()
登录后复制
相关推荐：
jQuery对象与原生DOM对象之间的区别及转换
js对象是什么？js对象类型有哪些？js对象类型的总结
以上就是jquery中图片无序预加载的实现以及使用方法的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/2743882.html
