Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can map tags be used for two images that overlap?

Tags:

html

css

We have two images with transparent sections that each have a map and separately they work fine. When the images are overlapped using css position relative and absolute only the top map seems to work. Is there some way to make both maps work?

Edit: We are only concerned with working in Mozilla and the w3 standard so no IE workarounds are needed.

like image 916
Adam Avatar asked Aug 27 '09 17:08

Adam


1 Answers

This is by design. According to the HTML 4.01 spec, section 13.6.1 ("Client-side image maps: the MAP and AREA elements"):

"If two or more defined regions overlap, the region-defining element that appears earliest in the document takes precedence (i.e., responds to user input)."


Source

Note for those who come hereafter looking for an answer to the same question: This answer does not address the issue of overlapping images. See the comments.

like image 196
Donut Avatar answered Sep 19 '22 13:09

Donut