zoukankan      html  css  js  c++  java
  • 图片超过规定的大小就按原图片大小缩小

     

    我们经常会遇到在页面中的图片按照我们自己的大小来显示,这样可以让页面看起来更规范一些。 
    比如我们要在页面种显示130×160的图片,相当于我们将图片放入这样的一个相框那,超过的就缩放到这个框的大小,小的就原样显示。

      
        我们这里有2种解决办法, 
        1,不按照比例的缩放 <script language="javascript"> 
    function changeImg(mypic){ 
        var xw=130; 
        var xl=160; 

        var width = mypic.width; 
        var height = mypic.height; 
                         
        if (width > xw ) mypic.width = xw; 
        if (height > xl ) mypic.height = xl; 

    </script> 
    <img src="sh180.jpg" onload="changeImg(this)">     

    2,按照比例的缩放 
    <script language="javascript"> 
    function changeImg1(mypic){ 
        var xw=160; 
        var xl=180; 
             
        var width = mypic.width; 
        var height = mypic.height; 
        var bili = width/height;         
             
        var A=xw/width; 
        var B=xl/height; 
             
        if(A>1||B>1) 
        { 
            if(A<B) 
            { 
                mypic.width=xw; 
                mypic.height=xw/bili; 
            } 
            if(A>B) 
            { 
                mypic.width=xl*bili; 
                mypic.height=xl; 
            } 
        } 

    </script> 
    <img src="sh180.jpg" onload="changeImg(this)"> 

  • 相关阅读:
    instance
    iptables
    centos系统准备
    Leecode no.236 二叉树的最近公共祖先
    Leecode no.235 二叉搜索树的最近公共祖先
    leecode no.98 验证二叉搜索树
    leecode no.109 有序链表转换二叉搜索树
    leecode no.113 路径总和 II
    Leecode no.112 路径总和
    Leecode no.111 二叉树的最小深度
  • 原文地址:https://www.cnblogs.com/winner/p/385507.html
Copyright © 2011-2022 走看看