|
View Full Version : Showing pictures on hover... Stickievix 03-31-2003, 06:21 PM How do you present a picture when you hover over some text or another picture. I have a small picture...and when I hover the mouse over it I would like a larger one to show... please help me guys... lots or luv, hugs and kisses.. vix xxx Stormx 03-31-2003, 06:38 PM For an image you could use the thing on the main body of this site where it changes to a different picture. You will need to make the two picures, but here is the code (It is from this site) Add this between the <head> and <title> tags. You can delete or add to the img[whatever] bit. Make sure you use your own images in place of "image1.gif" etc. --- <script language="JavaScript"> <!-- Hide the script from old browsers -- img0_on = new Image(width,height); img0_on.src="image2.gif"; img0_off = new Image(width,height); img0_off.src="image1.gif"; img1_on = new Image(width,height); img1_on.src="image4.gif"; img1_off = new Image(width,height); img1_off.src="image3.gif"; img2_on = new Image(width,height); img2_on.src="image6.gif"; img2_off = new Image(width,height); img2_off.src="image5.gif"; img3_on = new Image(width,height); img3_on.src="image8.gif"; img3_off = new Image(width,height); img3_off.src="image7.gif"; function over_image(parm_name) { document[parm_name].src = eval(parm_name + "_on.src"); } function off_image(parm_name) { document[parm_name].src = eval(parm_name + "_off.src"); } // --End Hiding Here --> </script> --- Then, whenever you want an image, insert this: --- <a href="yoururl.html" onmouseover="over_image('img0');" onmouseout="off_image('img0')"> <img src="image1.gif" border="0" name="img0"> </a> --- Remember to change the "img0" tags if you are using a different image. |