Size Image Tags

calendar October 29, 2009

All of the modern browsers start showing web pages as quickly as possible. This means browsers will start showing a page well before any images or other accompanying resources are downloaded. Because the browser hasn’t downloaded the image before rendering the page, it doesn’t know how big the image should be, unless you specify height and width attributes on the img tag.
If you don’t specify the width and height of images ,though, the page will jerk around as it’s being downloaded. The browser will guess at the size of the image but then find out after the image is downloaded that the actual size is much larger. Thus the browser will need to lay out the page again to adjust for the new size.

Code:

<html>
 <head>
 <title>Image Size</title>
 <?php
 function getImageSize($image)
 {
   list($width, $height) = getimagesize($image);
   print "<img src=\"$image\" width=\"$width\" height=\"$height\" />";
 }
 ?>
 </head>
 <body>
 <?php getImageSize("your_image.png"); ?>
 </body>
 </html>

You can use this function anywhere you would have put an img tag previously, don’t use this function in static headers or footers where the size of the images will never change.

admin PHP

One Response to “Size Image Tags”

  1. FERNANDO Says:
    September 6th, 2010 at 3:37 pm


    CheapTabletsOnline.com. Canadian Health&Care.Best quality drugs.No prescription online pharmacy.Special Internet Prices. High quality drugs. Buy pills online…

    Buy:Zyban.Arimidex.Nexium.Retin-A.Human Growth Hormone.Lumigan.Prednisolone.Prevacid.Valtrex.Petcam (Metacam) Oral Suspension.100% Pure Okinawan Coral Calcium.Mega Hoodia.Zovirax.Synthroid.Accutane.Actos….

Leave a Reply

You must be logged in to post a comment.