zoukankan      html  css  js  c++  java
  • JavaScript,等比例缩放图片的函数,很好用。

    在Web上显示图片,通常都会有图片显示比例问题,如果不给<img />限制width和height,那么如果图片大了就会将整个页面挤乱,图片小了又会使图片失真。
        我的需求如下:
            1、预先定义好图片显示的标准宽度和高度。
            2、如果图片的大小超过了标准定义,那么等比例压缩图片。
            3、如果图片的大小等于标准定义,那么按照标准宽度和高度显示图片。
            4、如果图片的大小小于标准定义,那么不对图片进行任何压缩处理。
        可能是我搜索的关键字不对吧,在网上找了很长时间,才找到,感觉很好使。代码如下

    代码
    <script language="JavaScript">
    <!--
    //图片按比例缩放
    var flag=false;
    function DrawImage(ImgD,iwidth,iheight){
        
    //参数(图片,允许的宽度,允许的高度)
        var image=new Image();
        image.src
    =ImgD.src;
        
    if(image.width>0 && image.height>0){
        flag
    =true;
        
    if(image.width/image.height>= iwidth/iheight){
            
    if(image.width>iwidth){  
            ImgD.width
    =iwidth;
            ImgD.height
    =(image.height*iwidth)/image.width;
            }else{
            ImgD.width
    =image.width;  
            ImgD.height
    =image.height;
            }
            ImgD.alt
    =image.width+"×"+image.height;
            }
        
    else{
            
    if(image.height>iheight){  
            ImgD.height
    =iheight;
            ImgD.width
    =(image.width*iheight)/image.height;        
            }else{
            ImgD.width
    =image.width;  
            ImgD.height
    =image.height;
            }
            ImgD.alt
    =image.width+"×"+image.height;
            }
        }

    //-->
    </script>
    调用:<img src="images/toplogo.gif" onload="javascript:DrawImage(this,100,100)">
  • 相关阅读:
    JavaWeb_day06_Filter过滤器
    JavaWeb_day05cookie_session_HttpSession
    接口(实例)演示
    FA常用表
    外连接简要总结
    项目操作习惯个人需养成的点
    接口的一般建立过程
    FA模块对折旧的个人理解
    Over分析函数的用法
    html报表 form端提交请求的制作
  • 原文地址:https://www.cnblogs.com/wantingqiang/p/1667828.html
Copyright © 2011-2022 走看看