Rumah >hujung hadapan web >tutorial js >js 控制图片大小核心讲解_javascript技巧

js 控制图片大小核心讲解_javascript技巧

WBOY
WBOYasal
2016-05-16 17:20:46904semak imbas

缩放图片脚本分享

复制代码 代码如下:




New Document





<script> <br><br>function AutoResizeImage(maxWidth,maxHeight){ <BR>var objImg = document.getElementById("operImg"); <BR>var img = new Image(); <BR>img.src = objImg.src; <BR>var hRatio; <BR>var wRatio; <BR>var Ratio = 1; <BR>var w = img.width; <BR>var h = img.height; <BR>wRatio = maxWidth / w; <BR>hRatio = maxHeight / h; <BR>if (maxWidth ==0 && maxHeight==0){ <BR>Ratio = 1; <BR>}else if (maxWidth==0){// <BR>if (hRatio<1) Ratio = hRatio; <BR>}else if (maxHeight==0){ <BR>if (wRatio<1) Ratio = wRatio; <BR>}else if (wRatio<1 || hRatio<1){ <BR>Ratio = (wRatio<=hRatio?wRatio:hRatio); <BR>} <BR>if (Ratio<1){ <BR>w = w * Ratio; <BR>h = h * Ratio; <BR>} <BR>objImg.height = h; <BR>objImg.width = w; <BR>} <BR></script>





534 X 800









重点js:
复制代码 代码如下:

function AutoResizeImage(maxWidth,maxHeight){
var objImg = document.getElementById("operImg");
var img = new Image();
img.src = objImg.src;
var hRatio;
var wRatio;
var Ratio = 1;
var w = img.width;
var h = img.height;
wRatio = maxWidth / w;
hRatio = maxHeight / h;
if (maxWidth ==0 && maxHeight==0){
Ratio = 1;
}else if (maxWidth==0){//
if (hRatio}else if (maxHeight==0){
if (wRatio}else if (wRatioRatio = (wRatio}
if (Ratiow = w * Ratio;
h = h * Ratio;
}
objImg.height = h;
objImg.width = w;
}
Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn