changing pictures...trouble...

[Biggie_mac]

I am having a problem with a "picture swap". I want to place a small picture which changes to another picture when you place the mouse over. i've tried the hover button from frontpage but it takes 5-6 sec until the buttons can be seen(there are 7 of'em). I've tried this:

<img src="poze/produse.jpg" height="21" width="160" border="1" name="picture2"
onmouseover ="document.picture2.src = 'poze/produse2.jpg' "
onmouseout ="document.picture2.src = 'poze/produse.jpg' "</a></a><p style="margin-top: 0; margin-bottom: 0" align="center">

but it either doesn't work or I have to hold the mouse over for 5-6 sec for the picture to change...who can give me some hints regarding this problem?

 

[LordOfLA]

heheh still the wrong forum you want coding and design but anyway

IIRC you need to specify its javascript somehow... but dontquote me on that.

 

[Jewelzz]

Moved and the other thread was deleted

 

[albybum]

<img src="poze/produse.jpg" border="1" id="picture2" 
onmouseover="document.getElementById('picture2').src='poze/produse2.jpg';" 
onmouseout="document.getElementById('picture2').src='poze/produse.jpg';" />

See it in action: http://www.albybum.net/temp/osnn/

Any lag time in the image rollover working could be due to the size of the image.

 

[Zedric]

Why not onmouseover="this.src='/poze/produse2.jpg';"?

 

[albybum]

Teaching someone to use the fully qualified method, ie getElementByID(), will give them the ability to change other images and more importantly other elements outside the scope of the current element.

Using 'this' keyword is valid and very handy when you want to avoid ID attributes, but I like to make sure people get the detailed example.