Image in frame on mouse hover

Discussion in 'Javascript' started by Fokke Nauta, Jan 26, 2006.

  1. Fokke Nauta

    Fokke Nauta Guest

    Hi all,

    I am searching for a script which does the following:

    I have a frameset with two pages: left and right.
    On the left page there is an image map. When I hover the mouse over a
    certain area of the image map, I want to appear an image in the right page.
    There are more area's on the image map. I want a specific picture to appear,
    each one correlated to a specific area. Is there any scrip which can do

    Thanks in advance for your help.

    With best regards,

    Fokke Nauta
    Fokke Nauta, Jan 26, 2006
    1. Advertisements

  2. Fokke Nauta

    Evertjan. Guest

    Fokke Nauta wrote on 26 jan 2006 in comp.lang.javascript:
    You could write a script, beste Fokke,
    but if there "is" one [where?] I wouldn't know.

    In Javascript you can reference other frames like this:

    <script type='text/javascript'>
    var Imag = parent.otherFrame.document.getElementById('imag')
    var ImagOrigSrc = Imag.src

    onmouseover = "Imag.src = '/images/myImg.jpg'"
    onmouseout = "Imag.src = ImagOrigSrc"

    Not tested.

    However, Fokke, why use frames?
    Much better use <div>s, classes and and css styles.
    Evertjan., Jan 26, 2006
    1. Advertisements

  3. Fokke Nauta

    Fokke Nauta Guest

    Hi Evert Jan,

    Thanks for your quick reply.
    I will give it a try, although I'm not a javascript programmer.
    Initially I wanted to use a frame because I thought this in the only way to
    show a picture when hovering over an image map. Obviously there must be
    other ways. I have to look into <div>s and classes.
    If you have a hint of how to achieve this without using a frame, you are

    Fokke Nauta, Jan 27, 2006
  4. Fokke Nauta

    Evertjan. Guest

    Fokke Nauta wrote on 27 jan 2006 in comp.lang.javascript:
    Frames have nothing to do with it.

    <map name="myMap">
    <area shape="rect" coords="20,30,650,111" nohref
    <area shape="rect" coords="....
    <area shape="rect" coords="....
    <area shape="..." coords="....

    <img src="/images/mapImage.jpg" border="0" usemap="#myMap"

    <imag src='default.jpg' id ='imloc'>

    <script ....

    function toggleImage(im){

    not tested, you will have to debug this.
    Evertjan., Jan 27, 2006
  5. Fokke Nauta

    Fokke Nauta Guest

    Bedankt, Evertjan.

    I'll give it a try!

    Best regards,
    Fokke Nauta, Jan 30, 2006
    1. Advertisements

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.