首页 > 代码库 > js 完成对图片的等比例缩放的方法
js 完成对图片的等比例缩放的方法
1 /* 2 重新按比例设置 页面上对应图片的长和高, 3 */ 4 function resetImgSize(id,imgWidth,imgHeight,posWidth,posHeight) { 5 var width = 0; 6 var height = 0; 7 // 按比例缩小图片的算法 8 if(imgWidth > imgHeight) { 9 if(imgWidth > posWidth) {10 width = posWidth;11 height = imgHeight/imgWidth * width;12 13 }else {14 width = imgWidth;15 height = imgHeight;16 }17 }else {18 if(imgHeight > posHeight) {19 height = posHeight;20 width = (imgWidth/imgHeight) * height;21 }else {22 width = imgWidth;23 height = imgHeight;24 }25 }26 width = Math.floor(width);27 height = Math.floor(height);28 $(‘#‘+id).attr(‘width‘,width);29 $(‘#‘+id).attr(‘height‘,height);30 $(‘#‘+id).css(‘padding-left‘,(posWidth-width)/2);31 $(‘#‘+id).css(‘padding-top‘,(posHeight-height)/2);32 33 }34 35 /*36 获取图片尺寸37 imgURL 图片加载地址38 posId 图片位置id39 posWidth 放在图片位置的width40 posHeight 放在图片位置的height41 */42 43 function getImgSize(imgURL,posId,posWidth,posHeight) {44 45 var img = new Image();46 47 48 img.src = http://www.mamicode.com/imgURL+‘?‘+Math.random();49 var width = 0;50 var height = 0;51 52 53 var check = function(){54 55 if(img.width > 0) {56 57 clearInterval(set);58 59 resetImgSize(posId,img.width,img.height,posWidth,posHeight);60 }61 };62 63 var set = setInterval(check,40);64 65 img.onload = function(){66 67 clearInterval(set);68 };69 70 71 }72 73 $(function(){74 $(‘.resetsize‘).each(function(){75 getImgSize(this.src,this.id,168,168);76 });77 });
js 完成对图片的等比例缩放的方法
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。