#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2013
    Posts
    2
    Rep Power
    0

    Mouseover problem


    The following "up" and "down" arrows work in an html document. Initially they show as a blue arrow and change to green on mouseover.

    This first code has the arrow pointing "down" and the arrow changes to green on mouseover.

    <a onmouseover="SwitchImg('document.arrow','document.arrow','images/greenarrow.gif')" onmouseout="RestoreImg()" href="#bottom"><img border="0" name="arrow" alt="Click" src="images/bluearrow.gif" width="23" height="32">

    This code has the arrow pointing up, it works but the image does not change color on mouseover. I've double checked the spelling of all the gifs.

    <a onmouseover="SwitchImg('document.arrow','document.arrow','images/greenarrowup.gif')" onmouseout="RestoreImg()" href="#top"><img border="0" name="arrow" alt="Click" src="images/bluearrowup.gif" width="23" height="32"></a>

    Thank you, any help would be appreciated.
  2. #2
  3. A Not To Shabby Code Smurf
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Aug 2008
    Posts
    1,175
    Rep Power
    184
    Originally Posted by elder76
    This code has the arrow pointing up, it works but the image does not change color on mouseover. I've double checked the spelling of all the gifs.
    Right off hand, without even looking @ your function(s)... the problem I see... is that you have both the images named "arrow". You need to name each image with a unique name and not name them, with the identically same name. This means you also need to change the parameter of your function for the image element's onmouseover and onmouseout event(s), as well.
    Last edited by web_loone08; February 7th, 2013 at 01:05 AM.
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2013
    Posts
    2
    Rep Power
    0
    Originally Posted by web_loone08
    Right off hand, without even looking @ your function(s)... the problem I see... is that you have both the images named "arrow". You need to name each image with a unique name and not name them, with the identically same name. This means you also need to change the parameter of your function for the image element's onmouseover and onmouseout event(s), as well.
    Thank you for your reply. I gave up on the code that I sent and turned to CSS at the advice of another coder. It was a much more elegant a solution and worked fine.

    Comments on this post

    • web_loone08 agrees : Yeah, CSS is the best and most modernist approach for what your wanting to do.

IMN logo majestic logo threadwatch logo seochat tools logo