[Javascript] Mapping Image

Flávio Gomes flavio at economisa.com.br
Mon Sep 11 15:21:15 CDT 2006


Wouldn't be the use of the tags MAP and AREA a good choice for this case?

 Are they "off"standard?

http://www.w3schools.com/tags/tag_map.asp
http://www.w3schools.com/tags/tag_area.asp <-- W3Schools say it suppors 
onmouseover, click, etc



Paul Novitski escreveu:

> At 9/11/2006 10:56 AM, Henrique Rennó wrote:
>
>> I'd like to know if it's possible to map points in an image in order 
>> to show some information about them in an area of the page. The idea 
>> is to move the cursor over a point and make appear a menu on the left 
>> giving some options.
>
>
>
> The easy way is to apply mouseover behavior to the image that triggers 
> the menu display automatically:
>
>         var oImage = document.getElementById("imageId");
>                 if (oImage)
>                 {
>                         oImage.onmouseover = fnMenuShow;
>                         oImage.onmouseout = fnMenuHide;
>                 {
>
> If you ever need to calculate whether a point on the screen is over 
> the image, you can do it this way:
>
> 1) Discover the image's exact X/Y position, for example:
> http://www.quirksmode.org/js/findpos.html
>
> 2) You know or can discover its width and length, e.g. 
> oImage.pixelWidth etc.
>
> 3) You're over the image if the mouse is:
>
>         to the right of its left edge
>         and to the left of its right edge
>         and below its top edge
>         and above its bottom edge
>
>         MouseX >= imageLeft
>         && MouseX <= imageLeft + imageWidth
>         && MouseY >= imageTop
>         && MouseY <= imageTop + imageHeight
>
> Regards,
> Paul
> _______________________________________________
> Javascript mailing list
> Javascript at LaTech.edu
> https://lists.LaTech.edu/mailman/listinfo/javascript


-- 
Flavio Gomes
flavio at economisa.com.br




More information about the Javascript mailing list