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 Coder
    Join Date
    Jul 2012
    Location
    Cape Town
    Posts
    12
    Thanks
    0
    Thanked 3 Times in 3 Posts

    Question simple roll over script

    Hi to all

    I need a java script roll over script for my navagation. I have 7 images in my navagation wich I want to be able to show the roll over.

    Example the mouse goes over the ''home.png'' link and then it chances to the ''home2.png'' when the mouse goes off it chances back to ''home.png''

    Thanks

    Here is a piece of code I found but it only works for 1 image and I have 7.

    Code:
    <script language="JavaScript">
    <!--
    Image01= new Image(32,32)
    Image01.src="rock on.jpg"
    Image02= new Image(32,32)
    Image02.src="like.jpg"
    //-->
    </script>
    
    <img src="rock on.jpg" border=0 name="Example" onmouseover="document.images['Example'].src=Image02.src" onmouseout="document.images['Example'].src=Image01.src">
    Last edited by cyber-ninja; 07-07-2012 at 01:44 AM.

  • #2
    367
    367 is offline
    New Coder
    Join Date
    Nov 2011
    Posts
    12
    Thanks
    3
    Thanked 0 Times in 0 Posts
    It would be much better to use css instead of js for this.
    css:
    a {
    background: url(image_default.gif);
    }
    a:hover {
    background: url(image_hover.gif);
    }

    html:
    <a href="link_path">link</a>

    Or with one image, just changing position for hover, like this: http://kyleschaeffer.com/best-practi...s-image-hover/


  •  

    Posting Permissions

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