生命不息,奋斗不止/创造价值-传递价值-获得价值
所谓迷茫,就是才华配不上梦想 每一个让你难堪的现在,都有一个不够努力的曾经

JS控制图片按比例缩放并不超过一定宽度和高度

1.如何使用,html页面代码(此处定义一个图片图片按照(宽170px或者高120px缩放))

<img onload=“javascript:DrawImage(this,170,120)” src=“http://center.blueidea.com/data/avatar/000/20/31/26_avatar_small.jpg”>



2.js通用方法

  1. //JS控制图片按比例缩放并不超过一定宽度和高度
  2. //图片按比例缩放
  3. function DrawImage(ImgD, iwidth, iheight) {
  4.     var flag = false;
  5.     var image = new Image();
  6.     //var iwidth = 620;            //定义允许图片宽度,当宽度大于这个值时等比例缩小
  7.     //var iheight = 360;            //定义允许图片高度,当宽度大于这个值时等比例缩小
  8.     var minwidth = iwidth  //图片最小宽度小于定义百分比;
  9.     var minheight = iheight //图片最小高度小于定义百分比
  10.     image.src = ImgD.src;
  11.     if (image.width > 0 && image.height > 0) {         //假如图片长宽都不为零
  12.         flag = true;
  13.         if (image.height / image.width >= iheight / iwidth) {       //通过正弦值判断图片缩放后是否偏高
  14.             if (image.height > iheight) {        //如果图片比设定的要高
  15.                 ImgD.height = iheight;
  16.                 ImgD.width = (image.width * iheight) / image.height;
  17.             } else {
  18.                 //假如图片width<70%(设定)&&heitht<70%(设定)
  19.                 if (image.height < minheight) {
  20.                     ImgD.height = minheight;
  21.                     ImgD.width = (image.width * minheight) / image.height;
  22.                 }
  23.                 else {
  24.                     ImgD.width = image.width;
  25.                     ImgD.height = image.height;
  26.                 }
  27.             }
  28.             //                    ImgD.alt = image.width + “×” + image.height;
  29.         }
  30.         else {           //如果图片比例 小于 设定的比例
  31.             if (image.width > iwidth) {
  32.                 ImgD.width = iwidth;
  33.                 ImgD.height = (image.height * iwidth) / image.width;
  34.             } else {
  35.                 //假如图片width<70%(设定)&&heitht<70%(设定)
  36.                 if (image.width <= minwidth) {
  37.                     ImgD.width = minwidth;
  38.                     ImgD.height = (image.height * minwidth) / image.width;
  39.                 }
  40.                 else {
  41.                     ImgD.width = image.width;
  42.                     ImgD.height = image.height;
  43.                 }
  44.             }
  45.             //                    ImgD.alt = image.width + “×” + image.height;
  46.         }
  47.     }
  48. }
赞(0)
未经允许不得转载:jack361博客 » JS控制图片按比例缩放并不超过一定宽度和高度

如果你爱我或恨我,请↓

联系我