HTML Background Image Map

Question

Возможно ли создать карту изображения из фонового изображения? Я бы хотел, чтобы стороны экрана были интерактивными, и я не вижу возможности сделать это без карты.

Answer 1

Вы можете создать абсолютное позиционированное изображение со следующим css, чтобы оно масштабировалось, чтобы оно соответствовало странице.

img.bg{ 
    position:absolute; 
    z-index:-100; 
    top:0;left:0;bottom:0;right:0; 
} 

, а затем используйте эту библиотеку, чтобы обеспечить масштабирование карты изображения со страницей.

https://github.com/davidjbradshaw/image-map-resizer

Answer 2

Вы можете использовать прозрачные фиксированные, плавающие <a> якоря теги, подобные этим:

<a style="display: scroll; position: fixed; top: 25px; left: 0px; width: 20px; height: 20px;" href="#"></a> 

<a style="display: scroll; position: fixed; top: 25px; right: 0px; width: 20px; height: 20px;" href="#"></a> 

Вы можете использовать атрибут bottom вместо top позиционировать метки относительно нижней части окна.