Redirecting to larger image

[collegedudesoon]

How's everyone doing?

The first question is a bit complicated however the latter question is rather elementary. I have a photography page with condensed versions of larger images. In order to view the larger images visitors must click onto the smaller version and then be directed to another page. This becomes frustrating for many users as they have to move back and forth. Is it possible to create a mouseover effect whereby rather than text appearing (ie alt attribute) the larger image appears? Is there another alternative?

My second question involves the blue border on an active image. I still want the border however I need it to be black rather than blue. I've tried text decoration: none to no avail. Perhaps I'm doing it wrong. Any help is greatly appreciated.

[David Harrison]

If you put this in your head section that should sort out the border problem for the images.

<style type="text/css"><!--

a img{border-color:#000;} /* If you take your images out of the links, simpley delete the "a ". */

--></style>

As far as clciking on the images is concerned, I wouldn't recommend replacing that with a mouse-over if the image is very large, it's not very good for us people with 56Kb modems. Also if an image becomes larger than space available for it, it might mess up the rest of the content around it.

Nevertheless, here's the code for a mouseover:

<img src="1.png" onmouseover="this.src='2.png'" onmouseout="this.src='1.png'" alt="Mouseover">

[collegedudesoon]

It takes me hours on internet search engines to come up with nothing yet in a matter of minutes on this forum I am provided with complete and correct answers. This must be webmaster heaven or something. The script you provided worked perfectly and I took your advice concerning the mouse-over. No use discarding one frustration for users yet adopting another.:) I'll be back!

[David Harrison]

Happy to help. :)

[PeOfEo]

About the sizes, take your image and resize it to about 100 x 100 or something and save it as a new image and then use the smaller one as a thumnail. Then make a link that will look like this
<a href="thebigpicture.jpg" target="_blank"><img src="thethumbnail.jpg"></a> What is happening is you are using the thumbail as a image link or button if you will to go to the big image.