js 自適應(yīng)控制圖片的大小

字號(hào):


    <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>
    調(diào)用方式(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>
    呵呵,多了兩個(gè)參數(shù),也就是你能夠接受的最大寬度maxwidth與最大高度maxheight