js 等比例缩放图片详解编程语言

//第一个参数是当前对象this,第二个是宽,第三个是高 
 
function datuIMG(datu,kuan,chang){ 
datu.width = kuan*100; 
datu.height = chang*100; 
//图片等比例缩小 
if(datu.width*chang>datu.height*kuan){ 
datu.width=kuan; 
datu.height=(kuan*chang)/kuan; 
} 
else{  
datu.width=(chang*kuan)/chang; 
datu.height=chang; 
} 
//图片居中显示 
//图片宽小于设定的边框宽 
if(datu.width<=kuan){ 
var kk = parseInt((kuan-datu.width)/2); 
datu.style.paddingRight = kk + "px"; 
datu.style.paddingLeft = kk + "px"; 
} 
//图片高小于设定的边框高 
if(datu.height<=chang){ 
var gg = parseInt((chang-datu.height)/2); 
datu.style.paddingTop = gg + "px"; 
datu.style.paddingBottom = gg + "px"; 
} 
 
} 
 
 
//使用 
 
在img上写onload事件  onload=" datuIMG(this,100,80)" 
 
 
最终的效果就会将无论多大的图片 等比缩放成 100*80

原创文章,作者:Maggie-Hunter,如若转载,请注明出处:https://blog.ytso.com/8715.html

(0)
上一篇 2021年7月18日
下一篇 2021年7月18日

相关推荐

发表回复

登录后才能评论