jquery图片预览插件实现方法详解

|| parseInt($lightImg.css("left")) != imgInfo.imgOriginLeft) {
$lightImg.animate({
"height" : imgInfo.imgActualHeight,
"width" : imgInfo.imgActualWidth,
"top": imgInfo.imgOriginTop,
"left": imgInfo.imgOriginLeft
});
}
},

// 获取图片信息
getImgInfo : function(imgPath, config) {
// 获取显示弹框的宽高
var boxHeight = config.boxHeight;
var boxWidth = config.boxWidth;

var imgObj = $("<img/>", {"src" : imgPath})[0];

// 获取图片的真实宽高
var imgRealHeight = imgObj.height;
var imgRealWidth = imgObj.width;

// 计算图片适应提示框大小后呈现的宽高
var imgActualHeight;
var imgActualWidth;
if (imgRealHeight / imgRealWidth >= boxHeight / boxWidth) {
imgActualHeight = imgRealHeight > boxHeight ? boxHeight : imgRealHeight;
imgActualWidth = imgActualHeight / imgRealHeight * imgRealWidth;
} else {
imgActualWidth = imgRealWidth > boxWidth ? boxWidth : imgRealWidth;
imgActualHeight = imgActualWidth / imgRealWidth * imgRealHeight;
}

var returnObj = new Object();
returnObj.imgPath = imgPath;
returnObj.imgRealHeight = imgRealHeight;
returnObj.imgRealWidth = imgRealWidth;
returnObj.imgActualHeight = imgActualHeight;
returnObj.imgActualWidth = imgActualWidth;

return returnObj;
},
};

// 插件供外部调用的两种写法
// 方法一：
LightBox.init = function(lightboxes) {

var _this_ = this;
var imgObjs = lightboxes.imgObj;
var config = lightboxes.config;

imgObjs.each(function() {
new _this_({
imgObj : $(this),
config : config
});
});

};
window.LightBox = LightBox;

// 方法二：注册成jq方法
$.fn.extend({
lightbox : function(config){
this.each(function(){
new LightBox({
imgObj : $(this),
config : config
});
});
return this;
}
});
}(jQuery));

// 下载图片 这个只能在chrome上用，firefox，IE都不行①jQuery实现图片下载代码