js缩略图原理

JavaScript017

js缩略图原理,第1张

1,按给定的宽和高进行智能缩小

2,按给定的宽和高进行固定缩小(会出现图片变形情况)

3,按给定的宽进行等比例缩小

4,按给定的高进行等比例缩小

5,宽和高按百分比缩小

先设置一段JS代码,如:function DrawImage(MyPic,W,H){

var flag=false

var image=new Image()

image.src=MyPic.src

if(image.width>0 &&image.height>0){

flag=true

if(image.width/image.height>= W/H){

if(image.width>W){

MyPic.width=W

MyPic.height=(image.height*W)/image.width

}

else{

MyPic.width=image.width

MyPic.height=image.height

}

}

else{

if(image.height>H){

MyPic.height=H

MyPic.width=(image.width*H)/image.height

}

else{

MyPic.width=image.width

MyPic.height=image.height

}

}

}

}

图片读取:<img src="图片路径" onload=""javascript:DrawImage(this,200,120)""border=""0"" width=""200"" height=""120""/>