homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

JavaScript and image map

 9:26 am on Aug 14, 2009 (gmt 0)

I have a floor plan. I would like to pop up a layer (should I say a DIV element) when a user moves his mouse cursor over one room (ie: displaying a large picture of the room, room facilities, etc).

I would like to have the layer(DIV element) displayed right below cursor's current position.

How to do that? Shall I :

1) Create layes/DIVs for each room (all hidden by default)
2) Create a HTML image map with Dreamweaver (can I have other better alternative?)
3) For each image map area, set a JavaScript event to call respective layer/DIV
4) Get current mouse cursor coordinate and display the layer based on the coordinate

If I create HTML image map by using Dreamweaver's built-in function, will it ONLY work when the page is loaded in the screen resolution I am using AND when the user does not resize the window?




 9:34 am on Aug 14, 2009 (gmt 0)

I just realized that each image map area's coordinate is based on the image's far top-left point, isn't it?

If yes, then resizing the window should have no impact on it.

Now the question is how to pass coordinates as parameters and display the hidden element right below the bottom line of the (mouse on) image map area.


 11:50 am on Aug 14, 2009 (gmt 0)

Are you sure you want the layer displayed below the cursor? So it'll move when you move your mouse?

Wouldn't it be better if the layer is displayed directly below the clickable area?



 4:05 pm on Aug 14, 2009 (gmt 0)

I would prefer the layer displayed below current image map area, not just below the cursor. It is because if the (image map) area is fairly large, then if I display the layer below cursor, some of the area will be obstructed. So I need to know the bottom line of the area and display the layer below the line.


Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved