Advertisement
Help Keep Boards Alive. Support us by going ad free today. See here: https://subscriptions.boards.ie/.
If we do not hit our goal we will be forced to close the site.

Current status: https://keepboardsalive.com/

Annual subs are best for most impact. If you are still undecided on going Ad Free - you can also donate using the Paypal Donate option. All contribution helps. Thank you.
https://www.boards.ie/group/1878-subscribers-forum

Private Group for paid up members of Boards.ie. Join the club.

Hover over Menu...i need help :)

  • 11-01-2010 11:39AM
    #1
    Registered Users, Registered Users 2 Posts: 94 ✭✭


    Hi,

    Just in the process of designing my first site,am using a basic web program so the layout etc is quite tidy.

    However there are a few things the program cannot help me with so i need to insert html codes to sort this out.

    One such case is that i want to have a menu,so that when the mouse hovers over the text/link an image will appear to give an insight into whats on the linked page.I have this set up and for the most part it works as i want it too.

    My problem is that the one image appears for both.

    Example:
    The way i want it to work
    Link One - Image One appears
    Link Two - Image Two appears

    But whats happens is
    Link One - Image One appears
    Link Two - Image One appears

    Here is the script im using:

    <html>
    <head>
    <title>Image Hover</title>
    <script type="text/javascript">
    function Show_Image(IDS) {
    document.getElementById(IDS).style.display = "block";
    }
    function Hide_Image(IDS) {
    document.getElementById(IDS).style.display = "none";
    }
    </script>
    </head>
    <body>
    <a href=" page14.html"
    onMouseOver=Show_Image('Img1') onMouseOut="Hide_Image('Img1')"> <small> Link One </small><BR><small> Sample</small></BR> </a>
    <span id="Img1" style="display:none">
    <div
    style="
    top: 40;
    left: 260;
    position: absolute;
    z-index: 1;
    visibility: show;"><img src="Image 1.jpg " alt=" <img src=" Image 1" alt=" Image 1.jpg" width="580" height="450" hspace="10" vspace="10" align="left" border="0" /></span></div>
    <br>
    <a href=" page15.html"
    onMouseOver=Show_Image('Img1') onMouseOut="Hide_Image('Img1')"> <small> Link Two</small><BR><small> Sample</small></BR> </a>
    <span id="Img2" style="display:none">
    <div
    style="
    top: 40;
    left: 260;
    position: absolute;
    z-index: 1;
    visibility: show;"><img src="Image 2.jpg " alt=" <img src=" Image 2.jpg" alt=" Image 2.jpg" width="580" height="450" hspace="10" vspace="10" align="left" border="0" /></span></div>
    </br>
    </body>
    </html>

    Any help would really be appreciated,
    Thank you :)


Comments

  • Registered Users, Registered Users 2 Posts: 94 ✭✭__plec__


    Sorry,ive been trying to figure out whats wrong all weekend,but just as i clicked the send button here it dawned on me what the problem was.So its all sorted,sorry if ive wasted anyones time,thanks


Advertisement