欢迎来到[自学php网] ①群 287460651

主页 > 网站前端 > jquery教程 >

js图片等比例缩放

来源:未知    时间:2016-08-18 10:15   阅读数:   作者:xxadmin

[导读] //图片比例缩放控制 www.zixuephp.com functionDrawImage(ImgD,FitWidth,FitHeight){varimage=newImage();image.src=ImgD.src;if(image.width0image.height0){if(image.width/image.height=FitWidth/FitHeight){if(image.widthFitWidth){ImgD.width=F...

//图片比例缩放控制 www.zixuephp.com

function DrawImage(ImgD,FitWidth,FitHeight){ 
    var image=new Image(); 
    image.src=ImgD.src; 
    if(image.width>0 && image.height>0) 
    { 
        if(image.width/image.height>= FitWidth/FitHeight) 
        { 
            if(image.width>FitWidth) 
            { 
                ImgD.width=FitWidth; 
                ImgD.height=(image.height*FitWidth)/image.width; 
            } 
            else 
            { 
                ImgD.width=image.width;   
                ImgD.height=image.height;   
            } 
        } 
        else 
        { 
           if(image.height>FitHeight) 
           { 
                ImgD.height=FitHeight; 
                ImgD.width=(image.width*FitHeight)/image.height; 
           } 
           else 
           { 
                ImgD.width=image.width; 
                ImgD.height=image.height; 
            } 
        }   
    } 
}

 

实例如下:


<div class="type-file-preview">

<img src="<?php echo UPLOAD_SITE_URL."/".ATTACH_ADV."/".$pic;?>" onload="javascript:DrawImage(this,500,500);">

</div>


最新文章

点击排行

自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习

京ICP备14009008号@版权所有www.zixuephp.com

网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com