Would like to know how to put images on my page so that once on the page they can be enlarged by clicking. The way I'm doing it now is taking way to much space.<br />
Appreciate any help<br />
trwchester<!--content-->Sounds like you want to use a thumbnail image. A small image that when clicked on displays a larger image.<br />
<br />
This takes a couple of steps. First open the large image and resize it smaller in your image editing software. Thumbnail images are generally about 50 to 80 pixels wide. Save the resized image using a different name than the original so you don't over write the original file.<br />
<br />
Now upload the small and large image to your website. Then use a hyper link with the small image like so:<br />
<br />
<a href=http://www.htmlforums.com/archive/index.php/bigimage.jpg target=_blank><img src=smallimage.jpg border=0></a><br />
<br />
change "bigimage.jpg" and "smallimage.jpg" to the correct name and/or URL of your images. When clicked on the big image will open in a new window. Remove border=0 in the above example if you want a blue hyperlink border around the small image.<br />
<br />
Regards,<br />
Kevin<!--content-->Often time people resize the entire image down to the little bitty image. I advise a combination of cropping and resizing. The point is to have the most important part of the image show on the thumbnail for better recognition.<br />
<br />
Original image:<br />
<!-- m --><a class="postlink" href="http://www.httpcity.com/TheKman/images/accord1a.jpg">http://www.httpcity.com/TheKman/images/accord1a.jpg</a><!-- m --><br />
Notice all the extra unneeded space in the photo, obviously, the car is the focus of the image.<br />
<br />
Most peoples thumbnail:<br />
<!-- m --><a class="postlink" href="http://www.httpcity.com/TheKman/images/accord1a-tmb.jpg">http://www.httpcity.com/TheKman/images/accord1a-tmb.jpg</a><!-- m --><br />
This is the above image simply resized.<br />
<br />
A cropped and resized thumbnail:<br />
<!-- m --><a class="postlink" href="http://www.httpcity.com/TheKman/images/accord1a-tmba.jpg">http://www.httpcity.com/TheKman/images/ ... a-tmba.jpg</a><!-- m --><br />
Notice some of the dead space is removed from the image before resizing to a thumbnail size. This makes the car bigger and more noticable in the thumbnail.<br />
<br />
Good Luck!<!--content-->very good point Kman
<br />
<br />
Kevin<!--content-->
Appreciate any help<br />
trwchester<!--content-->Sounds like you want to use a thumbnail image. A small image that when clicked on displays a larger image.<br />
<br />
This takes a couple of steps. First open the large image and resize it smaller in your image editing software. Thumbnail images are generally about 50 to 80 pixels wide. Save the resized image using a different name than the original so you don't over write the original file.<br />
<br />
Now upload the small and large image to your website. Then use a hyper link with the small image like so:<br />
<br />
<a href=http://www.htmlforums.com/archive/index.php/bigimage.jpg target=_blank><img src=smallimage.jpg border=0></a><br />
<br />
change "bigimage.jpg" and "smallimage.jpg" to the correct name and/or URL of your images. When clicked on the big image will open in a new window. Remove border=0 in the above example if you want a blue hyperlink border around the small image.<br />
<br />
Regards,<br />
Kevin<!--content-->Often time people resize the entire image down to the little bitty image. I advise a combination of cropping and resizing. The point is to have the most important part of the image show on the thumbnail for better recognition.<br />
<br />
Original image:<br />
<!-- m --><a class="postlink" href="http://www.httpcity.com/TheKman/images/accord1a.jpg">http://www.httpcity.com/TheKman/images/accord1a.jpg</a><!-- m --><br />
Notice all the extra unneeded space in the photo, obviously, the car is the focus of the image.<br />
<br />
Most peoples thumbnail:<br />
<!-- m --><a class="postlink" href="http://www.httpcity.com/TheKman/images/accord1a-tmb.jpg">http://www.httpcity.com/TheKman/images/accord1a-tmb.jpg</a><!-- m --><br />
This is the above image simply resized.<br />
<br />
A cropped and resized thumbnail:<br />
<!-- m --><a class="postlink" href="http://www.httpcity.com/TheKman/images/accord1a-tmba.jpg">http://www.httpcity.com/TheKman/images/ ... a-tmba.jpg</a><!-- m --><br />
Notice some of the dead space is removed from the image before resizing to a thumbnail size. This makes the car bigger and more noticable in the thumbnail.<br />
<br />
Good Luck!<!--content-->very good point Kman
<br /><br />
Kevin<!--content-->