Elliot B. Posted April 10, 2003 Share Posted April 10, 2003 http://www.bbelectrical.pwp.blueyonder.co..../fprollover.gif When I point over "Image #1" I want a GIF image to be displayed in the right cell. Is this possible? Link to comment Share on other sites More sharing options...
0 mikey Posted April 10, 2003 Share Posted April 10, 2003 yea, its possible... gimme 2 secs to write the code Link to comment Share on other sites More sharing options...
0 theprotege Posted April 10, 2003 Share Posted April 10, 2003 there are a few good javascript sites that can help also, i'm not at home but i'll post them when i get there...where i get most of my free code... Link to comment Share on other sites More sharing options...
0 mikey Posted April 10, 2003 Share Posted April 10, 2003 (edited) <html> <head> <script> <-- Begin <script LANGUAGE="JavaScript"> <!-- Begin // Preload and mouseover scripts // copyright Mike Bignell - http://mike.rbmb.co.uk // Preload all images used for script! image1 = new Image(); image1.src = "images/image1.gif"; image2 = new Image(); image2.src = "images/image2.gif"; image3 = new Image(); image3.src = "images/image3.gif"; // End --> </script> </head> <body> <table> <tr> <td><a href="page1.html" onMouseOver="document.image_swap.src='images/image1.gif';" onMouseOut="document.image_swap.src='images/NoMouseOver.gif';">Image #1</a></td> <td rowspan=3><img src="images/NoMouseOver.gif" name="image_swap"></td> </tr><tr> <td><a href="page2.html" onMouseOver="document.image_swap.src='images/image2.gif';" onMouseOut="document.image_swap.src='images/NoMouseOver.gif';">Image #2</a></td> </tr><tr> <td><a href="page3.html" onMouseOver="document.image_swap.src='images/image3.gif';" onMouseOut="document.image_swap.src='images/NoMouseOver.gif';">Image #3</a></td> </tr> </table> </body> </html> Erm... could you test that for me... im too lazy to make some images and test them, lol [EDIT] Ive tested it... It works fine :) i also attached the script in a ZIP :D [/EDIT] mouseover.zip Edited April 10, 2003 by mikey Link to comment Share on other sites More sharing options...
0 Elliot B. Posted April 10, 2003 Author Share Posted April 10, 2003 (edited) Thanks man, but: http://www.bbelectrical.pwp.blueyonder.co....cripterror1.gif http://www.bbelectrical.pwp.blueyonder.co....cripterror2.gif Edited April 10, 2003 by King Mustard Link to comment Share on other sites More sharing options...
0 mikey Posted April 10, 2003 Share Posted April 10, 2003 Ok, heres the updated script :D (forgot to add the comment line to the broswer compatibility failsafe :whistle: ) mouseover.zip Link to comment Share on other sites More sharing options...
0 Elliot B. Posted April 10, 2003 Author Share Posted April 10, 2003 One problem, when you point @ link 2 and image 2 is displayed, could you make it stays there so people can move over to it and save the image? Link to comment Share on other sites More sharing options...
0 mikey Posted April 11, 2003 Share Posted April 11, 2003 Sure... erm, ive done it for all of the links, not just image 2... Here it is: mouseover_nomouseout.zip Link to comment Share on other sites More sharing options...
0 Elliot B. Posted April 11, 2003 Author Share Posted April 11, 2003 (edited) Works great mate, thanks! :) However, small question: In order to stretch/shrink an image add something like: <img border="0" src="09.04.03.gif" width="323" height="242"> ... right? Well, I tried adding it to the end of your script and it didn't work: image1 = new Image(); image1.src = "images/1.gif" width="325" height="240"; image2 = new Image(); image2.src = "images/2.gif" width="325" height="240"; image3 = new Image(); image3.src = "images/3.gif" width="325" height="240"; The images retained their original sizes :( How can I make them shrink? Edited April 11, 2003 by King Mustard Link to comment Share on other sites More sharing options...
0 john smith 1924 Veteran Posted April 11, 2003 Veteran Share Posted April 11, 2003 your treating it like an <img src > tag which it isnt; its a java script... Link to comment Share on other sites More sharing options...
0 mikey Posted April 11, 2003 Share Posted April 11, 2003 You would have to use DHTML to change the size of the image... if you want them to all be the same size, you can just change the <img> width & height of the main image. The part you are changing is just to pre-load all of the images into the browser, it is not completely neccasary, just wrote it for speeding up peoples views. Link to comment Share on other sites More sharing options...
0 Elliot B. Posted April 11, 2003 Author Share Posted April 11, 2003 I've messed around with DHTML, but I can't do it :'( Man, I suck Link to comment Share on other sites More sharing options...
0 Elliot B. Posted April 12, 2003 Author Share Posted April 12, 2003 Anyone? :'( Link to comment Share on other sites More sharing options...
0 Shaman Posted April 14, 2003 Share Posted April 14, 2003 id be interested to know too Link to comment Share on other sites More sharing options...
Question
Elliot B.
http://www.bbelectrical.pwp.blueyonder.co..../fprollover.gif
When I point over "Image #1" I want a GIF image to be displayed in the right cell. Is this possible?
Link to comment
Share on other sites
13 answers to this question
Recommended Posts