Borgs8472
01-13-2006, 11:56 PM
Hey all. I have a nice mouseover code which allows you to have one image that if you put the mouse over it goes to another one.
Example (http://www.wordforge.net/showpost.php?p=579462&postcount=6)
( I am aware of the potential trolling uses of this, so no need to point them out thanks ;) )
The html replacement is:
<a onMouseOver="document.the_image.src='{option}';" onMouseOut="document.the_image.src='{param}';"> <img src="{param}" name="the_image" border-style:dotted;></a>
(nb: the dotted border was working - never mind)
and the usage is:
{param}
Where option and param are both image paths.
The problem with this code, is it only works once per page.
This means if the code is used twice in a page, neither image will do the mouseover effects.
This must be due to how document.the_image.src is called multiple times and asked to do mutually contradictory things.
I've looked on many webpages on how I might handle this with multiple images, but all of them involve predefining the mouseover images in the header, which is of course no good when I want user optional images.
Would anyone know a way of making document.the_image.src perhaps define itself as a unique variable so it doesn't interfere with other document.the_image.src elements? Or setting up an array of usable ids in the header perhaps?
I hope I've explained myself okay :)
Example (http://www.wordforge.net/showpost.php?p=579462&postcount=6)
( I am aware of the potential trolling uses of this, so no need to point them out thanks ;) )
The html replacement is:
<a onMouseOver="document.the_image.src='{option}';" onMouseOut="document.the_image.src='{param}';"> <img src="{param}" name="the_image" border-style:dotted;></a>
(nb: the dotted border was working - never mind)
and the usage is:
{param}
Where option and param are both image paths.
The problem with this code, is it only works once per page.
This means if the code is used twice in a page, neither image will do the mouseover effects.
This must be due to how document.the_image.src is called multiple times and asked to do mutually contradictory things.
I've looked on many webpages on how I might handle this with multiple images, but all of them involve predefining the mouseover images in the header, which is of course no good when I want user optional images.
Would anyone know a way of making document.the_image.src perhaps define itself as a unique variable so it doesn't interfere with other document.the_image.src elements? Or setting up an array of usable ids in the header perhaps?
I hope I've explained myself okay :)