Javascript 如何阻止通过iframe的滚动事件，直到iframe处于活动状态？

我有一个长长的滚动页面。在这个滚动页面上有一个iframe，它有一个媒体应用程序，当它接收到滚动事件时，该应用程序可以放大和缩小媒体

如果用户使用鼠标滚轮滚动用户页面，最终他们将点击iframe，此时页面将停止滚动，iframe将放大媒体应用程序很远

如果我禁用iframe的鼠标事件，则用户永远无法放大或单击媒体应用程序

---

有没有一种方法可以防止iframe上的默认滚动操作，并使其仅在iframe处于活动状态时发生？

如果不进行测试，我有两种方法可以解决此问题

1向iframe提供css值指针事件：无；并在其处于活动状态时将该值设置回“自动”

iframe {
    pointer-events: none;
}
iframe:active {
    pointer-events: auto;
}

---

2通过JavaScript删除iframe的eventlistener，并在iframe激活后再次绑定它们。

您可以使用以下步骤：

将iframe包装到div元素中。不能使用iframe的onclick方法。 更改iframe元素的指针事件属性当事件单击时，将在父div元素上激发mouselive。 以下是JQuery示例：

    $('#iframeContainer').on('click', function(event) {
        $('#iframe').css('pointer-events', 'auto');
    });

    $('#iframeContainer').mouseleave(function(event) { 
        $('#iframe').css('pointer-events', 'none'); 
    });

---

非常聪明。工作完美。谢谢