手机版

jquery图片预加载自动等比例缩放插件

时间:2021-10-27 来源:互联网 编辑:宝哥软件园 浏览:

复制代码代码如下:/* **************图片预加载插件****************** ///作者:没剑(2008-06-23)///http://regedit。cn博客。com//说明:在图片加载前显示一个加载标志,当图片下载完毕后显示图片出来可对图片进行是否自动缩放功能此插件使用时可让页面先加载,而图片后加载的方式,解决了平时使用时要在图片显示出来后才能进行缩放时撑大布局的问题///参数设置:缩放是否等比例自动缩放宽度图片最大高高度图片最大宽loadpic加载中的图片路径*/jQuery.fn.LoadImage=function(缩放、宽度、高度负荷pic){ if(负荷pic==null)负荷pic='负荷3。gif ';返回这个。每个(function(){ var t=$(this);var src=$(this).attr(' src ')var img=new Image();//警报('加载')img。src=src//自动缩放图片var autoScaling=function(){ if(scaling){ if(img。宽度0 img。高度0){ if(img。宽度/img。高度=宽度/高度){ if(img。width width){ t . width(width)};t .高度((img。高度*宽度)/img。宽度);} else { t . width(img。宽度);身高高度);} } else { if(img。高度(height){ t . height(高度);t .宽度((img。宽度*高度)/img。高度);} else { t . width(img。宽度);身高高度);} } } } } //处理消防下会自动读取缓存图片if(img。完整){//alert(' gettopache!');自动缩放();返回;} $(这个)。attr('src ',' ');var loading=$('img alt=\ '加载中\' title=\ '图片加载中\ ' src=\ ' load pic ' \ '/');t . hide();t.after(装载);美元.load(function(){ autoScaling();装货。移除();t.attr('src ',这个。src);show();//alert('终于!') });});}使用说明:$('div img ').LoadImage(真,120,90);效果如下:测试地址http://img . JB 51 . net/online/jqueryLoadImage/demo . htm(9500 . 163.com)

文件打包下载

版权声明:jquery图片预加载自动等比例缩放插件是由宝哥软件园云端程序自动收集整理而来。如果本文侵犯了你的权益,请联系本站底部QQ或者邮箱删除。