背景图像上的图像映射

Question

我有一个网站项目，需要模仿走过一套房间的经验。由于Flash已经过时，我决定使用HTML / CSS和JS来实现这一目标。

为了点击门，我做了一些像这样的图像映射：

<area
        alt="intrare-lobby"
        title="Intrare"
        shape="poly"
        coords="1257,676,1256,569,1259,565,1268,560,1278,558,1287,558,1293,559,1298,560,1304,564,1306,568,1307,677"
        rel="Intrare Lobby"
        role="link"
/>

我在图像映射中发现的问题是，我可以获得的对屏幕分辨率的最大调整是使图像响应。响应图像适应页面的宽度，但不适应其高度。

由于整个网站都是用图像构建的，因此在CSS中使用这些图像是有意义的，使用＃34;覆盖＆＃34;设置为它的大小。

该网站将有一个移动版本，因此只需要从平板电脑分辨率向上调整屏幕。

我知道图片映射仅限于标记。有什么方法可以在背景图像上用JavaScript获得相同的效果吗？

项目的链接是https://sporedev.ro/pleiade2/。我目前在左侧和大楼入口处的雕像上都有映射。