用户在移动设备上触摸/滑动IFRAME的任何部分时，如何将元素隐藏在IFRAME之外？

Question

当我通过touchmove事件在移动设备上的IFRAME上滑动时，尝试隐藏IFRAME之外的DIV时，我需要帮助修复/优化代码。 IFRAME内容与此代码位于相同的域名内，但位于不同的目录中。

HTML结构示例：

<iframe id="iframe_to_swipe" src="SAME ORIGIN" />
<div id="div_to_hide"></div>

<style>
#div_to_hide {display: block}
</style>

window.onload = function() {
    var oFrame = document.getElementById("iframe_to_swipe");
    oFrame.contentWindow.document.onclick = function() {
        document.getElementById("div_to_hide").style.display = "none";
    };
};

我上面的代码可以通过onClick事件在桌面上完美运行。下面是我尝试用于移动设备但无法正常工作的内容。

window.onload = function() {
document.getElementById("iframe_to_swipe").addEventListener("touchmove", myFunction);
function myFunction() {
document.getElementById("div_to_hide").style.display = "none";
}

在移动设备上滑动/触摸“ iframe_to_swipe”时，我想隐藏“ div_to_hide”