Javascript 将hammerjs与translate3d一起使用。。。重置为0
所以,在我用这个移动一个项目之后。。。它停留在我离开的地方。但是,如果我再次尝试抓住它,当我开始移动它时,它从“零”开始,而不是从我留下它的地方开始。发生这种情况是因为ev.deltaX指的是当前的手势。您可以在平移结束时保存其值,然后在计算平移时添加该值 比如:Javascript 将hammerjs与translate3d一起使用。。。重置为0,javascript,hammer.js,Javascript,Hammer.js,所以,在我用这个移动一个项目之后。。。它停留在我离开的地方。但是,如果我再次尝试抓住它,当我开始移动它时,它从“零”开始,而不是从我留下它的地方开始。发生这种情况是因为ev.deltaX指的是当前的手势。您可以在平移结束时保存其值,然后在计算平移时添加该值 比如: ready = -> transform = {} handlePan = (ev) -> el = $(".actions[data-object='" + ev.target.dataset.obje
ready = ->
transform = {}
handlePan = (ev) ->
el = $(".actions[data-object='" + ev.target.dataset.object + "']")
el.removeClass('accept').addClass('reject') if ev.deltaX < 0
el.removeClass('reject').addClass('accept') if ev.deltaX > 0
transform.translate = { x: ev.deltaX }
updateElementTransform(ev.target.dataset.object)
updateElementTransform = (obj) ->
value = [
'translate3d(' + transform.translate.x + 'px, 0px, 0)'
]
value = value.join(" ")
el = document.querySelector(".vehicle[data-object='" + obj + "']")
el.style.webkitTransform = value
el.style.mozTransform = value
el.style.transform = value
createHammer = (v) ->
mc = new Hammer.Manager(v, {})
mc.add new Hammer.Pan(
direction: Hammer.DIRECTION_HORIZONTAL
threshold: 0
)
mc.on 'panleft', handlePan
mc.on 'panright', handlePan
selector = '.market-place .vehicle'
createHammer(v) for v in document.querySelectorAll(selector)
$(document).ready(ready)
$(document).on('page:load', ready)
var totalDeltaX = 0;
mc.on('pan', function(e){
// translateX = totalDeltaX + e.deltaX ...
});
mc.on('panend', function(e){
// totalDeltaX += e.deltaX ...
});