我一直在谷歌上搜索一下,并试图确定如何在一个html元素(例如div)上执行简单的滑动事件,以便在javascript中执行某些操作。
<div id="swipe_me">
Swipe Test
</div>
有人可以给我看或给我一些文件吗?
答案 0 :(得分:0)
的JavaScript。
有点像(未经测试的代码)
onInitialized: function(e, slider) {
var time = 1000, // allow movement if < 1000 ms (1 sec)
range = 100, // swipe movement of 50 pixels triggers the slider
x = 0, t = 0, touch = "ontouchend" in document,
st = (touch) ? 'touchstart' : 'mousedown',
mv = (touch) ? 'touchmove' : 'mousemove',
en = (touch) ? 'touchend' : 'mouseup';
slider.$window
.bind(st, function(e){
// prevent image drag (Firefox)
e.preventDefault();
t = (new Date()).getTime();
x = e.originalEvent.touches ? e.originalEvent.touches[0].pageX : e.pageX;
})
.bind(en, function(e){
t = 0; x = 0;
})
.bind(mv, function(e){
e.preventDefault();
var newx = e.originalEvent.touches ? e.originalEvent.touches[0].pageX : e.pageX,
r = (x === 0) ? 0 : Math.abs(newx - x),
// allow if movement < 1 sec
ct = (new Date()).getTime();
if (t !== 0 && ct - t < time && r > range) {
if (newx < x) { slider.goForward(); }
if (newx > x) { slider.goBack(); }
t = 0; x = 0;
}
});
}