javascript - Fullpage.js选项normalScrollElementTouchThreshold有什么作用？

我不太了解这个选项及其运作方式，该文档提供了解释，但实际上这是一个示例吗？

从文档:

最佳答案

随着normalScrollElements元素通过DOM结构向下传播，选项mouseover在桌面浏览器上非常容易工作。

对于触摸设备，此实现稍微复杂一些，因此normalScrollElementTouchThreshold参与其中。 touchstart或touchmove事件不会以这种方式传播。

识别到触摸事件后，将返回您手指下的DOM结构中最深的元素。

这意味着，例如，如果您的网站上有一个灯箱弹出式插件，并且希望它与normalScrollElements选项一起使用，则如果其中包含divs或paragrphas，则将返回这些元素，而不是将其放入灯箱容器中您正在应用normalScrollElements。

因此，要让插件查看是否是忽略它的元素，就必须在DOM结构中检查父元素。
默认情况下，它将最多检查5个 parent 。但是您可以根据需要进行更改。

为了更好地说明它，请想象一下这种情况:

<div class="section">
    <div class="myLightBox">
        <div class="title">My Title</div>

        <div class="body">
            <div class="box" style="height:400px; display:block">Box1</div>
            <div class="box" style="height:400px; display:block">Box1</div>
        </div>
    </div>
</div>

初始化:

$('#fullpage').fullpage({
    normalScrollElements: '.myLightBox',
});

如果将lightobx触摸box元素，则box元素将返回到插件touchstart或touchmove事件。

当您将normalScrollElements设置为myLightBox时，由于myLightBox与box元素不同，它将使该部分向上或向下滚动。

为了解决此问题，该插件在DOM结构中将其与normalScrollElements中的值进行比较时上升了5个级别，因此它将检查box，body和最后的myLightBox，这将导致插件忽略对该元素的自动滚动。