$(function () {
???????????????//$(".pimg").click(function () {
???????????????$(".layer-photos-demo img").click(function () {
???????????????????var _this = $(this);//将当前的pimg元素作为_this传入函数
???????????????????imgShow("#outerdiv", "#innerdiv", "#bigimg", _this);
???????????????});
???????????});
function imgShow(outerdiv, innerdiv, bigimg, _this) {
???????????var src = _this.attr("src");
???????????$(bigimg).attr("src", src);
???????????/*获取当前点击图片的真实大小,并显示弹出层及大图*/
???????????$("<img/>").attr("src", src).load(function () {
???????????????var windowW = $(window).width();
???????????????var windowH = $(window).height();
???????????????var realWidth = this.width;
???????????????var realHeight = this.height;
???????????????var imgWidth, imgHeight;
???????????????var scale = 0.8;
???????????????if (realHeight > windowH * scale) {
???????????????????imgHeight = windowH * scale;
???????????????????imgWidth = imgHeight / realHeight * realWidth;
???????????????????if (imgWidth > windowW * scale) {
???????????????????????imgWidth = windowW * scale;
???????????????????}
???????????????} else if (realWidth > windowW * scale) {
???????????????????imgWidth = windowW * scale;
???????????????????imgHeight = imgWidth / realWidth * realHeight;
???????????????} else {
???????????????????imgWidth = realWidth;
???????????????????imgHeight = realHeight;
???????????????}
???????????????$(bigimg).css("width", imgWidth);
???????????????var w = (windowW - imgWidth) / 2;
???????????????var h = (windowH - imgHeight) / 2;
???????????????$(innerdiv).css({ "top": h, "left": w });
???????????????$(outerdiv).fadeIn("fast");
???????????});
???????????$(outerdiv).click(function () {
???????????????$(this).fadeOut("fast");
???????????});
???????}
JS图片放大1
原文地址:https://www.cnblogs.com/Ly426/p/9768613.html