HammerJS pan在Firefox中为孙子元素失败

Question

我有一个gallery pen（基于pen by Drew Power）与Hammerjs Pan水平滑动图像。适用于Chrome和Safari，但不适用于Firefox

基本结构：

<div class="slider">
    <picture><img></picture>
    <picture><img></picture>
    <picture><img></picture>
</div>

• div.slider是Hammer.Manager实例el，带有“pan”监听器。
• 每个img也会附带源标签

在Firefox中，img上的左/右边距暴露了一些父图片元素，点击父图片启动平移工作。但点击它的子元素img不起作用。平移聆听者听到事件并启动平移，但它立即结束。

使用CSS touch-action：none和-webkit-user-drag：none on没有区别。

取而代之的是删除img标签并将其用作div的背景，因为我们失去了使用picture + source + img标签获得的响应式图像大小的好处。

这是https://codepen.io/seanbischoff/details/aYYoMy/问题的一支笔

任何帮助是极大的赞赏！

Answer 1

添加draggable='false'和ondragstart='return false'属性。它会阻止在FF中拖动。

<img src="..." draggable='false' ondragstart='return false'>

Modified CodePen