JS图片压缩–图片后加载后按比例缩放

okscvdsv

okscvdsv

2016-02-19 14:15

岁数大了,QQ也不闪了,微信也不响了,电话也不来了,但是图老师依旧坚持为大家推荐最精彩的内容,下面为大家精心准备的JS图片压缩–图片后加载后按比例缩放,希望大家看完后能赶快学习起来。

原理:图片加载完后把图片的尺寸固定在一个固定的范围之内。。

JS Code:

script type="text/javascript"

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

var proMaxHeight=100;
var proMaxWidth=100;


function ImgAuto(ImgD)
{
var image=new Image();
image.src=ImgD.src;
image.onload = function(){
if(image.width0&&image.height0)
{
var rate=(proMaxWidth/image.widthproMaxHeight/image.height)?proMaxWidth/image.width:proMaxHeight/image.height;
if(rate=1)
{
ImgD.width=image.width*rate;
ImgD.height=image.height*rate
}
else
{
ImgD.width=image.width;
ImgD.height=image.height;
}
}
};
image.onload();
};

/script

HTML Code:

body
img src="http://s3.knowsky.com/l/45001-55000/200952916491584421395.jpg" onload="ImgAuto(this)" id="test"/
script type="text/javascript" src="img.js"/script

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

/body

展开更多 50%)
分享

猜你喜欢

JS图片压缩–图片后加载后按比例缩放

Web开发
JS图片压缩–图片后加载后按比例缩放

图片按比例缩放函数

Web开发
图片按比例缩放函数

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

关于图片按比例自适应缩放

平面设计 海报设计 广告设计 画报设计 签名设计 服装设计 名片设计 画册设计 版式设计 商标设计
关于图片按比例自适应缩放

图片预加载并且自动等比例缩放的JS插件

Web开发
图片预加载并且自动等比例缩放的JS插件

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

用js按比例重定图片尺寸

Web开发
用js按比例重定图片尺寸

利用CSS按比例缩小图片

Web开发
利用CSS按比例缩小图片

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

谁会让我心痛 - QQ非主流分组

谁会让我心痛 - QQ非主流分组

深入equals方法

深入equals方法
下拉加载更多内容 ↓