www.webdeveloper.com
Results 1 to 5 of 5

Thread: On mouse over change image

  1. #1
    Join Date
    Nov 2002
    Location
    Sibiu, Romania
    Posts
    16

    On mouse over change image

    Hello ppl, I'm new to this forum and I'm new to javascript and maibe you can help me.

    What I want is when I moce the mouse over a link (text link) to change an image like this:

    ---------------
    | image here|
    | |
    ----------------

    Menu :

    Link1
    Link2
    Link3
    Link4


    ... so when I move the mouse over link1 I want img1.gif to be in "image here" , when I move the mouse over link2 img2.gif to be in "image here" ...

    I hope you understand what I want and maibe you can help me.
    10x and see ya

  2. #2
    Join Date
    Nov 2002
    Posts
    20
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html><head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type="text/javascript">

    img1 = new Image();
    img1.src = "file.ext";

    img2 = new Image();
    img2.src = "file.ext";

    img3 = new Image();
    img3.src = "file.ext";


    img4 = new Image();
    img4.src = "file.ext";

    function change(num){

    document.images[linkpic].src = eval("img" + num);

    }

    </script>
    </head>
    <body>
    <img src="file.ext" name="linkpic">
    <br><br>

    <a href="page.ext" onclick="change('1')"><br>
    <a href="page.ext" onclick="change('2')"><br>
    <a href="page.ext" onclick="change('3')"><br>
    <a href="page.ext" onclick="change('4')"><br>

    </body>
    </html>

  3. #3
    Join Date
    Nov 2002
    Posts
    4,473
    You don't need the eval, and you need some quotes:
    document.images[linkpic].src = eval("img" + num);
    Should be:

    document.images["linkpic"].src = "img" + num + ".ext";

    (whatever .ext means)

    He asked for mouseover, not click:

    <a href="page.ext" onmouseover="change('1')">

    You probably want a mouseout as well.

  4. #4
    Join Date
    Nov 2002
    Location
    Sibiu, Romania
    Posts
    16

    more details for you

    Hello ppl,

    you can see the site I made here :
    www.nokitel.sibiul.ro , and in the left side I have the menu, above the menu I have a circle, there is the pic I wanna change when I move the mouse over a link, and I'm gonna need an mouseout to.

    I'm gonna try the script you gived me and I'm gonna tell if it's working and if it's not maibe you can help me again

    10x anyway

    see ya all

  5. #5
    Join Date
    Dec 2002
    Posts
    2
    If you go to http://www.dynamicdrive.com/dynamicindex5/linkinfo.htm they have the script your looking fo there. if you have html skills you can customize it with out a problem.

    Alex

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles