SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Hybrid View

  1. #1
    SitePoint Guru Chroniclemaster1's Avatar
    Join Date
    Jun 2007
    Location
    San Diego, CA
    Posts
    784
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    getElementsByName not working?

    Hi!

    I'm building an unobtrusive image rollover function. The basic function is working ok. In the file I have an image with id="contactImage" AND name="contactImage".

    In my .js file I have...

    Code:
    function rollOver(newPath) {
         document.images['contactImage'].src = newPath;
    }
    
    document.getElementById("contactImage").onmouseover = function {rollOver("Images/mouseoverimage.jpg")};
    
    document.getElementById("contactImage").onmouseout = function {rollOver("Images/image.jpg")};
    This works fine with the event handlers using the id attribute, and rollOver() using the name attribute. So question one is, can I eliminate the id? I'd really rather have that available for other uses than having to use two attributes just to make the rollover. But I've tried swapping this for

    Code:
    document.getElementsByName("contactImage").onmouseover = function {rollOver("Images/mouseoverimage.jpg")};
    Even though everything I read says this is a DOM level 1 method, IE and FF don't swap the image. (Though IE doesn't throw errors like during my little experiment with getElementByName. Ooops!) What am I doing wrong? (Feel free to say everything! )
    Whatever you can do or dream you can, begin it.
    Boldness has genius, power and magic in it. Begin it now.

    Chroniclemaster1, Founder of Earth Chronicle
    A Growing History of our Planet, by our Planet, for our Planet.

  2. #2
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,875
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    If you want the first field by that name you need:

    document.getElementsByName("contactImage")[0].onmouseover

    That call returns an array of all the fields with that name since name is not required to be unique the way id is.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  3. #3
    SitePoint Guru Chroniclemaster1's Avatar
    Join Date
    Jun 2007
    Location
    San Diego, CA
    Posts
    784
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ooooo... Yes, a small yet critical matter of syntax. It's an array.

    Thank you once again, Stephen! It's working fine now.
    Whatever you can do or dream you can, begin it.
    Boldness has genius, power and magic in it. Begin it now.

    Chroniclemaster1, Founder of Earth Chronicle
    A Growing History of our Planet, by our Planet, for our Planet.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •