В IE9 нет прямоугольника фокуса на теге области - PullRequest
Новая
       31

В IE9 нет прямоугольника фокуса на теге области

1 голос
/ 14 июня 2011

Я обнаружил, что мой прямоугольник фокуса не отображается в IE9, когда я переключаюсь между элементами на карте изображения ниже.Вкладка по-прежнему работает нормально, и в Chrome фокус отображается нормально. 

<img name="scr5diagram" src="scr5-diagram.gif" width="909" height="600" id="scr5diagram" usemap="#m_scr5diagram" alt="Interactive diagram showing areas of focus" />
<map name="m_scr5diagram" id="m_scr5diagram">
    <area href="#" class="fader" id="s5b1" shape="poly" coords="35,32,157,32,159,33,160,35,160,125,159,127,157,128,35,128,33,127,32,125,32,35,33,33,35,32,35,32" alt="" />
    <area href="#" class="fader" id="s5b2" shape="poly" coords="259,32,381,32,383,33,384,35,384,125,383,127,381,128,259,128,257,127,256,125,256,35,257,33,259,32,259,32" alt="" />
    <area href="#" class="fader" id="s5b3" shape="poly" coords="483,32,605,32,607,33,608,35,608,125,607,127,605,128,483,128,481,127,480,125,480,35,481,33,483,32,483,32" alt="" />
</map>

Пожалуйста, помогите.Спасибо.

1 Ответ

0 голосов
/ 18 апреля 2012

Согласно спецификации HTML :

Первая пара координат x и y и последняя должны быть одинаковыми, чтобы закрыть многоугольник. Когда эти значения координат не совпадают, пользовательские агенты должны определить дополнительную пару координат, чтобы закрыть многоугольник.

Попробуйте использовать другой инструмент для генерации координат. В IE9 работает следующий тест: 

<!doctype html>
<html lang="en">
<head>
    <title>Poly Rectangle Test</title>
</head>
<body>
<img id="stackoverflow" name="stackoverflow" src="http://www.stackoverflow.com/favicon.ico" width="32" height="32" usemap="#stackmap" alt="stackoverflow.com"/>
<map id="stackmap" name="stackmap">
    <area href="http://www.stackoverflow.com" shape="poly" coords="0,16,16,0" alt="Point one"/>
    <area href="http://www.stackoverflow.com" shape="poly" coords="16,16,16,0" alt="Point two"/>
    <area href="http://www.stackoverflow.com" shape="poly" coords="0,0,16,16" alt="Point three"/>
    <area href="http://www.stackoverflow.com" shape="poly" coords="0,16,16,16" alt="Point four"/>
</map>
</body>
</html>
...