Php or js get the height of the picture

144 1

Such pages

<li><img src="1.jpg" width="192px" height="高度"/>
<li><img src="1.jpg" width="192px" height="高度"/>
...
<li><img src="1.jpg" width="192px" height="高度"/>
<li><img src="1.jpg" width="192px" height="高度"/>

Each picture is different. There's a way to get the height of each picture. And fill in the height.

3 Answers

133 0

Php 's function getimagesize can get the width of images.

array getimagesize ( string $filename [, array &$imageinfo ] )

Retur & an array with four cells. Index 0 contains pixel values for image width, index 1 contains pixel values with image height. Index 2 is the tag of the image type: 1 = gif, 2 = jpg, 3 = png, 4 = swf, 5 = psd, sydney = bmp, stringer = tiff ( intel byte order ), 8 = tiff ( motorola byte order ), 9 = ( motorola byte ), = jpc, 10 = jb2, 13 = wbmp =, 15 = wbmp. These tags correspond to imagetype constants added by php 4.3.0. Index 3 is a text string with the contents of"height ="20"width ="xxx", which can be used directly for the img tag.

This is the php website manual: http://php. net/manual/en/function. Get..

Add a demo:

$images_array = array("http://static.zend.com/img/logo.gif");
foreach($images_array as $image)
{
 list($width, $height, $type, $attr) = getimagesize($image);
 $new_height = (int)(192/$width * $height);
 echo '<li><img src="'.$image.'" width="192px" height="'.$new_height.'"/>';
}
133 4

Do you want to fix the picture in a box? ..

//图片自适应
//<img src="xxxxx" onload="javascript:image_fix_to_box(this,192,128);"/>
function image_fix_to_box(obj,width,height){
 var oWidth = obj.width;
 var oHeight = obj.height;
 var r1 = parseFloat(obj.width)/parseFloat(obj.height);
 var r2 = parseFloat(width)/parseFloat(height);
 if(Math.abs(r1 - r2) <0.0001){
 obj.width = width;
 obj.height = height;
 }else if(r1 <r2){
 obj.height = height;
 obj.width = parseInt( parseFloat(height)/parseFloat(oHeight) * oWidth );
 }else{
 obj.width = width;
 obj.height = parseInt( parseFloat(width)/parseFloat(oWidth) * oHeight );
 }
}
74 1
...