js 自適應控制圖片的大小
來源:易賢網(wǎng) 閱讀:731 次 日期:2016-06-22 09:42:02
溫馨提示:易賢網(wǎng)小編為您整理了“js 自適應控制圖片的大小”,方便廣大網(wǎng)友查閱!

<script language=javascript>

var flag=false;

function drawimage(imgd){

var image=new image();

image.src=imgd.src;

if(image.width>0 && image.height>0){

flag=true;

if(image.width/image.height>=500/400){

if(image.width>500){

imgd.width=500;

imgd.height=(image.height*500)/image.width;

}else{

imgd.width=image.width;

imgd.height=image.height;

}

}

else{

if(image.height>400){

imgd.height=400;

imgd.width=(image.width*400)/image.height;

}else{

imgd.width=image.width;

imgd.height=image.height;

}

}

}

}

</script>

調用方式(img是顯示圖片的html代 ) <img src= temp.jpg border=0 onload=javascript:drawimage(this);>

修改后:

<script language=javascript>

var flag=false; //控制小圖

function drawimage(imgd,maxwidth,maxheight){

var image=new image();

image.src=imgd.src;

if(image.width>0 && image.height>0){

flag=true;

if(image.width/image.height>=maxwidth/maxheight){

if(image.width>maxwidth){

imgd.width=maxwidth;

imgd.height=(image.height*maxwidth)/image.width;

}else{

imgd.width=image.width;

imgd.height=image.height;

}

}

else{

if(image.height>maxheight){

imgd.height=maxheight;

imgd.width=(image.width*maxheight)/image.height;

}else{

imgd.width=image.width;

imgd.height=image.height;

}

}

}

}

</script>

呵呵,多了兩個參數(shù),也就是你能夠接受的最大寬度maxwidth與最大高度maxheight

更多信息請查看腳本欄目
易賢網(wǎng)手機網(wǎng)站地址:js 自適應控制圖片的大小

2025國考·省考課程試聽報名

  • 報班類型
  • 姓名
  • 手機號
  • 驗證碼
關于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡要咨詢 | 簡要咨詢須知 | 加入群交流 | 手機站點 | 投訴建議
工業(yè)和信息化部備案號:滇ICP備2023014141號-1 云南省教育廳備案號:云教ICP備0901021 滇公網(wǎng)安備53010202001879號 人力資源服務許可證:(云)人服證字(2023)第0102001523號
聯(lián)系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關注公眾號:hfpxwx
咨詢QQ:526150442(9:00—18:00)版權所有:易賢網(wǎng)