Results 1 to 4 of 4
  1. #1
    Join Date
    Aug 2005
    Location
    Peaches bed ;)
    Posts
    2,118
    Tokens
    200

    Latest Awards:

    Default On mouseover image change.

    can someone tell me the code where when you put your mouseover an image it changes into another image? +rep if it works
    Mario

  2. #2

    Default

    Well im not a genius when it comes to JS but I've tested this and it works I guess..

    HTML Code:
    <script type="text/javascript">
    function over(id, up, over)
    {
        document.getElementById(id).src = over;
    }
        
    function out(id, over, up)
    {
        document.getElementById(id).src = up;
    }
    </script>
    <img src="image_1.png" id="one" onmouseOver="over(this.id, this.src, 'image_1_over.png');" onmouseout="out(this.id, this.src, 'image_1.png)" />
    replace the images in the ' ' with the images you want to use

  3. #3
    Join Date
    Dec 2007
    Location
    Toronto, Ontario, Canada
    Posts
    689
    Tokens
    0

    Default

    Are you using DIVs styled with CSS?

  4. #4
    Join Date
    Jul 2005
    Location
    Belgium
    Posts
    2,492
    Tokens
    147

    Latest Awards:

    Default

    Yeah, use div's & css, much easyer, cleaner (in my opinion)

    basicly you'ld have a css like;
    (just change the width & height to whatever size your image is)

    HTML Code:
    #divname{
    background-image: url(path/to/image.png);
    background-repeat: no-repeat;
    width: 100px;
    height: 100px;
    }
    
    #divname:hover{
    background-image: url(path/to/image_hover.png);
    background-repeat: no-repeat;
    width: 100px;
    height: 100px;
    }

Posting Permissions

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