Question

我通常使用Genially创建这张地图，并以这张图片作为背景-选中this link。

问题是我必须使该地图具有响应性，以便可以从较低分辨率的设备进行访问。我曾考虑过使用transform: scale(2);缩放元素，并添加一些可以将其拆分的JavaScript，但是鉴于缩放功能的工作原理，它无法按预期工作。

地图不在iFrame中，而是在我的网站上呈现。

Answer 1

在媒体查询中对大图像进行display: none并将图像切成小段并一一显示的情况如何。
，或在模板中使用srcset在屏幕调整大小时显示不同的图像大小。 https://html.com/attributes/img-srcset/。

<img srcset="
  /filepath/flamingo4x.jpg 4025w,
  /filepath/flamingo3x.jpg 3019w,
  /filepath/flamingo2x.jpg 2013w,
  /filepath/flamingo1x.jpg 1006w
 " src="/filepath/flamingo-fallback.jpg">

如何使此图像映射元素具有响应性？

1 个答案: