gpt4 book ai didi

javascript - 带有 hammerjs 滑动检测的输入类型范围在移动 safari 上不可用

转载 作者:行者123 更新时间:2023-11-30 17:16:23 28 4
gpt4 key购买 nike

我正在开发一个网络应用程序,右侧有一个小菜单,我想滑入和滑出。

所以我包含了 hammerjs,它向文档正文添加了滑动,并在左侧滑动时滑出侧边菜单,在右侧滑动时返回侧边菜单。就像一个魅力。

现在我的问题是,如果我添加 hammerjs 滑动检测,我在页面上也有 slider (),我不能再移动 slider 了。在 Firefox 上, slider 有时会变慢并挂起。

当我删除 hammerjs 检测时, slider 会按预期工作。有谁知道我如何解决这个问题?

HTML

<div id="container">
<input id="slide" type="range" min="0" max="100" value="100">
</div>
<div id="text">
</div>

JS

var mc = new Hammer.Manager(document.getElementById('container'));
mc.add(new Hammer.Swipe({
direction: Hammer.DIRECTION_HORIZONTAL
}));

var textElement = document.getElementById('text');
textElement.innerHTML= 'noSwipe';
mc.on('swipe', function (e) {
textElement.innerHTML = 'swipe'+e.direction;
});

CSS

#container {
width:100%;
height:200px;
border: 1px solid blue;
}

我做了 a fiddle这显示了问题。

最佳答案

有同样的问题,唯一帮助我的是防止触摸事件冒泡。

var stop = function(event) {
event.stopPropagation();
};
$element.on('touchmove', stop);
$element.on('touchstart',stop);
$element.on('touchend', stop);

实际上它足以阻止'touchmove',但为了可靠性我添加了'start'和'end'。

关于javascript - 带有 hammerjs 滑动检测的输入类型范围在移动 safari 上不可用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26054481/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com