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 5 of 5
  1. #1
    New Coder
    Join Date
    Aug 2012
    Posts
    19
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Displaying tooltip in parent from right frame

    Hi

    I have a web page:
    http://dgssi.com/barton/directory.html
    with a mall map in the web page and an iframe located on right.

    I need to get it so that when you hover over a store name in the right frame, a tooltip displays in the main page over the map at a specified location.

    Is there a script that I can find that will do this?
    I have looked around and not found anything suitable.

    Thanks for any help.

    Kath

  • #2
    Regular Coder
    Join Date
    Mar 2012
    Posts
    102
    Thanks
    2
    Thanked 5 Times in 4 Posts
    I don't think you can do that because it's a hole image. If the image was broken up then it would be possible.

  • #3
    New Coder
    Join Date
    Aug 2012
    Posts
    19
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hi bigcasey 123

    I can break the image down to whatever I need to to get this working.
    Could you pls let me know how to do this?

    Thanks.

  • #4
    Senior Coder
    Join Date
    Apr 2011
    Location
    London, England
    Posts
    2,120
    Thanks
    15
    Thanked 354 Times in 353 Posts
    The fact that it is a single image is not really relevant, but it might take a bit of Googling to find a script that you could adapt.

    Essentially, you might insert an absolutely positioned div just inside the <td> that contains the image, with the css: left and top 0, display:none, and a high z-index.
    You need to know the left and top pixel positions (within the image) where you wish to position the tooltip to correspond to each store. Store these in an array or, more likely, an array of objects, along with the descriptive text for the corresponding store. [I would use the store names as the array keys.]
    Then use mouse-events on the store-names (in the iframe) to hide and show the tooltip at the correct positions. The mouse-events could also dynamically change the height and width of the tooltip to reflect the amount of text in the description.

    This is just an outline. You might be in luck and find a suitable script to adapt.
    "I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
    Validate your HTML and CSS

  • #5
    Senior Coder
    Join Date
    Apr 2011
    Location
    London, England
    Posts
    2,120
    Thanks
    15
    Thanked 354 Times in 353 Posts
    .. a jQuery tooltip-plugin might make the whole process easier, but it will probably still need some tweaking to respond correctly to events within the iframe.
    "I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
    Validate your HTML and CSS


  •  

    Posting Permissions

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