Применить css к ОБЛАСТИ КАРТЫ - PullRequest
22 голосов
/ 17 февраля 2011

Я создал очень большую карту с множеством поли областей (более 20 координат каждая) для регионов внутри карты.Однако вы не можете добавить css в тег AREA, поскольку мне сказали, что это не видимый элемент.То, что я хочу сделать, это когда пользователь наводит курсор на область на карте, я хочу, чтобы он был «выделен», применяя границу в 1 пиксель к определенному элементу AREA.Есть ли способ сделать это?Нет, я не собираюсь прибегать к использованию прямоугольников.

Ответы [ 3 ]

15 голосов
/ 17 февраля 2011

Невозможно с CSS.
Вы можете проверить плагин Map Hilight jQuery.

РЕДАКТИРОВАТЬ 10.2011
ImageMapster - более новый и более мощный плагин, вы также должны проверить.

10 голосов
/ 17 февраля 2011

Если вы хотите иметь возможность использовать произвольные формы и все еще использовать стили, вы рассматривали возможность попробовать SVG?

Я не мастер SVG, но вот пример, который я набрал: http://jsfiddle.net/tZKuv/3/. Для производства вы можете захотеть заменить штрих по умолчанию на none, я использовал gray, чтобы вы могли видеть, где он находится.

Недостатком является то, что вы потеряете область простоты использования/ карта дает вам, но я думаю, вы можете достичь своей цели, если вы пойдете по этому пути.Я добавил cursor: pointer к многоугольнику, и вы можете добавить обработчики onclick для имитации href из <area>.

Очевидное предостережение - поддержка браузера.Кажется, это работает в Chrome, и я уверен, что он должен работать в IE9 (jsfiddle не работает в IE9 в настоящее время), но предыдущие версии IE не поддерживают SVG.

Обновление : Сделана быстрая тестовая страница для тестирования IE9.Это действительно работает, как ожидалось. Вот источник .

Обновите снова : Это также решит проблему масштабирования, о которой вы спрашивали в другом вопросе.

2 голосов
/ 17 февраля 2011

Нет, нет способа сделать это, как вы описываете.Я исследовал это и попробовал.Что вы можете сделать, так это настроить события наведения мыши на различные сегменты и поменять местами какое-либо наложенное изображение, затененное в той же области.

...