Блог

Главная - Вопросы по программированию - Карта изображений в Firefox не отображается за пределами окна просмотра при загрузке страницы

Карта изображений в Firefox не отображается за пределами окна просмотра при загрузке страницы

#html #firefox #imagemap

Вопрос:

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

Я создал кодовую панель, имитирующую проблему, с которой мы сталкиваемся в нашей системе: https://codepen.io/joseluismedina/pen/BadQxzG

 img {
  width: 1200px;
} 
 <div class="image-map">
  <img src="https://images.unsplash.com/photo-1634585248909-c80e77988e4d?crop=entropyamp;cs=srgbamp;fm=jpgamp;ixid=MnwxNDU4OXwwfDF8cmFuZG9tfHx8fHx8fHx8MTYzNDkwMDE0Mgamp;ixlib=rb-1.2.1amp;q=85" usemap="#imagemap"/>

  <map name="imagemap">
    <area alt="" title="" href="#" coords="601,2,1199,214,1199,330,3,331,3,214" shape="poly">
    <area alt="" title="" href="#" coords="4,339,174,598" shape="rect">
    <area alt="" title="" href="#" coords="180,340,342,598" shape="rect">
    <area alt="" title="" href="#" coords="350,598,515,340" shape="rect">
    <area alt="" title="" href="#" coords="520,597,685,341" shape="rect">
    <area alt="" title="" href="#" coords="691,598,856,341" shape="rect">
    <area alt="" title="" href="#" coords="862,598,1027,340" shape="rect">
    <area alt="" title="" href="#" coords="1033,598,1199,341" shape="rect">
    <area alt="" title="" href="#" coords="5,607,271,742" shape="rect">
    <area alt="" title="" href="#" coords="301,742,585,608" shape="rect">
    <area alt="" title="" href="#" coords="617,743,878,609" shape="rect">
    <area alt="" title="" href="#" coords="908,606,1198,741" shape="rect">
  </map>
</div>

Область изображения, которая не была отрисована, появится при нажатии на какую-либо область карты изображения.

Протестировано в Firefox 93.0 (64-разрядная версия).

Метки: