Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jun 2004
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Arrow Suggestion: Use Mouseover? Tables? Looking for a simple fix.



    Referring to the image above:

    What I'd like to do is have the image (Pepsi-like symbol) change when the
    mouse is placed over various links (shown). I'm sure there are several different ways of pulling this off, but I'd like to know what first comes to mind for the experts.

    Thanks,
    J.L.O.

  • #2
    Senior Coder
    Join Date
    Feb 2004
    Posts
    1,206
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Give the image an ID.
    Code:
     <img id="main_img" src="pepsi.jpg"/>
    Create an image swap function as follows:
    Code:
     function imageSwap(imgId, imgSrc) {
      var img = document.getElementById(imgId);
      img.src = imgSrc;
     }
    Then call this function onmouseover and onmouseout of the links:
    Code:
     <a href="http://www.google.com" onmouseover="imageSwap('main_img','img1.jpg');" onmouseout="imageSwap('main_img','pepsi.jpg');">Link 1</a>
    That's what I would do.....
    Sadiq.


  •  

    Posting Permissions

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