Html iframe在鼠标滚动时放大和缩小

我已经在我的网站中加入了一个

iframe

。。每当我滚动时，地图都会放大和缩小。。我试图通过将

指针事件

设置为

无

来避免这种情况，但这会删除地图上的所有操作，我无法导航

html:

---

一个想法是在上面戴上面具：

<div class="map">
    <iframe src="https://www.google.com/maps/embed?xxx"></iframe>
    <div class="mask"></div>
</div>

整个地图将是不可触摸的

---

但是如果您想在不启用缩放的情况下启用左/右导航，可能会有所帮助

.map iframe {pointer-events: none;}

<div class="map">
    <iframe src="https://www.google.com/maps/embed?xxx"></iframe>
    <div class="mask"></div>
</div>

.map .mask {
    width: 100%;
    height: 100%;
}