Js Code for automatically scaling down images in a specified area

Js Code for automatically scaling down images in a specified area

Sometimes the content we update contains many large images, which may cause page deformation or fail to see the full picture. In general, we use the max-width Control of css, but some browsers do not support it. We can also use js to supplement it.

The Code is as follows:

<Div id = article> </div>

<Script type = "text/javascript">

// Scale the image to a proper size

Function ResizeImages ()

{

Var myimg, oldwidth, oldheight;

Var maxwidth = 550;

Var maxheight = 880

Var imgs = document. getElementById ('Article'). getElementsByTagName ('img '); // if your defined id is not article, modify it here

 

For (I = 0; I

Myimg = imgs [I];

 

If (myimg. width> myimg. height)

{

If (myimg. width> maxwidth)

{

Oldwidth = myimg. width;

Myimg. height = myimg. height * (maxwidth/oldwidth );

Myimg. width = maxwidth;

}

} Else {

If (myimg. height> maxheight)

{

Oldheight = myimg. height;

Myimg. width = myimg. width * (maxheight/oldheight );

Myimg. height = maxheight;

}

}

}

}

// Scale the image to a proper size

ResizeImages ();

</Script>

 

 

 

This means to control the image size in the specified area, otherwise some advertisement images will be distorted.

 

The picture control code used by the script house:

The Code is as follows:

Function controlImg (ele, w, h ){

Var c = ele. getElementsByTagName ("img ");

For (var I = 0; I <c. length; I ++ ){

Var w0 = c [I]. clientWidth, h0 = c [I]. clientHeight;

Var t1 = w0/w, t2 = h0/h;

If (t1> 1 | t2> 1 | w0> = 600 ){

C [I]. width = Math. floor (w0/(t1> t2? T1: t2 ));

C [I]. height = Math. floor (h0/(t1> t2? T1: t2 ));

If (document. all ){

C [I]. outerHTML = '<a href = "' + c [I]. src + '"target =" _ blank "title =" view image in new window ">' + c [I]. outerHTML + '</a>'

}

Else {

C [I]. title = "opening an image in a new window ";

C [I]. onclick = function (e) {window. open (this. src )}

}

}

}

}

 

 

Ele is the specified area. w is the maximum width. If it is greater than this, it will be reduced. H is the maximum height.