I was working on my World War II photo gallery recently. The gallery’s HTML code, particularly the main content section, looks something like the following.
Because my vertical navigation bar is on the right side of the page, if a photograph is larger than a particular width, it overlaps the vertical bar. I decided to remove the vertical bar if the photo is too large; let us assume that if the image width is larger than 580 pixels, it is too large. To apply the logic, I used the getimagesize() function. A quick example on this function is below.
list($imageWidth, $imageHeight, $imageType, $imageAttr) = getimagesize($imgName); echo("The width of the image is ".$imageWidth." pixels."); // Sample output: "The width of the image is 600 pixels."
I used the following PHP code to make my page work the way I want to based on width of the image.
if ($imageWidth <= 580) { ?>
Beyond width, the getimagesize() function in PHP also outputs other properties; the output is an array containing four elements. As you may have noticed, in my above example, I captured the following properties.
- 0 $imageWidth : Width of the image in pixels; integer.
- 1 $imageHeight : Height of the image in pixels; integer.
- 2 $imageType : Type of the image; integer. Possible values are as follows:
Value Description 1 GIF 2 JPG 3 PNG 4 SWF 5 PSD 6 BMP 7 TIFF (Intel) 8 TIFF (Motorola) 9 JPC 10 JP2 11 JPX 12 JB2 13 SWC 14 IFF 15 WBMP 16 XBM - 3 $imageAttr : HTML-formatted attributes; string. Example: ‘height=”600″ width=”400″‘