Координаты в теге AREA и масштабирование картинки-карты

[GRIG]

Задумал для одного сайта сделать картинку-карту, по кликам на которую пользователь может увидеть разные разделы информации. Стал делать примерно так:

    <img src="menu1.png" usemap="#mymap" style="width: 100%"/>
    <map id="mymap" name="mymap">
	  <area shape="rect" coords="32,245,142,265" href="#page1">
	  <area shape="rect" coords="32,275,142,295" href="#page2">
....

И при этом наткнулся на неприятность: координаты активных областей карты в тегах area задаются абсолютно, а размер картинки-карты может меняться в зависимости от разрешения экрана и размеров окна броузера. Т.е. по какой-то фиксированный размер картинки я координаты подобрать могу, но при изменении размеров картинки у пользователя все эти координаты слетят нафиг.

Есть ли тут какое решение, которое учитывает этот аспект?

[antonKar]

Только что проверил на одном из своих сайтов, где активно используется area - всё нормально с масштабированием.

Вы помимо 100% для ширины задайте явно height: auto.

[GRIG]

  On 7/21/2013 at 4:01 PM, antonKar said:

Только что проверил на одном из своих сайтов, где активно используется area - всё нормально с масштабированием.

Вы помимо 100% для ширины задайте явно height: auto.

Тогда я, похоже, что-то не понимаю в этом деле. height задать для какого объекта? И координаты вычислять в каких единицах?

И еще: то, что тег area работает независимо от масштабирования, - это понятно. Мне нужно, чтобы при изменении размеров картинки-карты активные области карты смещались вместе с соответствующими участками изображения. А пока что получается, что после масштабирования при клике мышой на область с надписью "page1" происходит переход на ссылку "page2" (или что-то вроде того)

[npofopr]

Может через % и абсолютные позиционирования?

[antonKar]

  On 7/21/2013 at 5:37 PM, npofopr said:

абсолютные позиционирования

Возможно что и в позиционировании ещё дело.

У меня Firebug показывает, что на area распространяются стили, заданные для img

http://s019.radikal.ru/i610/1307/85/df0135590ff4.png