Как я могу показать контур области карты изображения (html, javascript)?

Question

Если вы быстро посмотрите на две ссылки ниже, вы увидите, что большинство людей хотят избавиться от контуров вокруг области карты на изображении.Я вижу, что это происходит исключительно на платформе MAC OS X.

Удаление контура на области карты изображения

Как избавиться от этого контура границы дляобласти моей карты изображений при нажатии (только OS X Chrome)

Однако я хочу показать контур в нескольких браузерах и изменить его цвет и ширину.Я пытался, но безуспешно.Я создал стиль для идентификатора.Не сработалоЯ пытался использовать класс, и это не сработало.Я установил встроенный стиль, и это тоже не сработало.И, между прочим, я попытался сделать это и с тегами карты, и с областями.

На данный момент я использую gif, чтобы "ограничить" область при нажатии.Но было бы намного проще, если бы я мог воспользоваться встроенным атрибутом shape, чтобы выделить область, по которой щелкнули.

Большое спасибо за любую помощь.

Answer 1

Этот ответ выглядит интересным:

Изменение цвета / прозрачности div при наведении курсора или использование карты изображений

Ссылки здесь: http://davidlynch.org/js/maphilight/docs/demo_simple.html

Answer 2

Более старые версии Internet Explorer не учитывают CSS для контуров области. Вы можете решить эту проблему, заблокировав передачу по умолчанию для события mousedown. При использовании jquery, что-то вроде

$('area').bind('mousedown',function(e) {
    e.preventDefault();
});

позаботится об этом для всех карт изображений на странице.

Также взгляните на мой плагин: http://www.outsharked.com/imagemapster, который позволит вам легко обрабатывать контурные (и другие) эффекты при наведении мыши и событиях щелчка.