[英]Custom “swipe” events in Mobile Safari not firing
我為jQuery編寫了一個模擬移動事件的插件,但也支持標准的Web瀏覽器。 這是swipeleft
和swiperight
事件的標記:
(function($) {
var settings = {
swipe_h_threshold : 30,
swipe_v_threshold : 50,
taphold_threshold : 750,
startevent : ('ontouchstart' in document.documentElement) ? 'touchstart' : 'mousedown',
endevent : ('ontouchstart' in document.documentElement) ? 'touchend' : 'mouseup'
};
// swipeleft Event:
$.fn.swipeleft = function(handler) {
return this.each(function() {
$this = $(this);
var start_x = 0;
var end_x = 0;
$this.bind(settings.startevent, function(e) {
e.stopPropagation();
e.preventDefault();
start_x = e.pageX;
$this.one(settings.endevent, function(e) {
end_x = e.pageX;
if(start_x > end_x && (start_x - end_x >= settings.swipe_h_threshold))
{
handler.call(this);
}
});
});
});
};
// swiperight Event:
$.fn.swiperight = function(handler) {
return this.each(function() {
var $this = $(this);
var start_x = 0;
var end_x = 0;
$this.bind(settings.startevent, function(e) {
e.preventDefault();
e.stopPropagation();
start_x = e.pageX;
$this.one(settings.endevent, function(e) {
end_x = e.pageX;
if(start_x < end_x && (end_x - start_x >= settings.swipe_h_threshold))
{
handler.call(this);
}
});
});
});
};
}) (jQuery);
然后我使用以下方法調用事件:
$('#my_div')。swiperight(function(){self.nextCard('r');}); $('#my_div')。swipeleft(function(){self.nextCard('r');});
這似乎在桌面瀏覽器(好吧,Chrome無論如何)> http://ben-major.co.uk/labs/carousel.html上工作正常,但似乎在Mobile Safari中不起作用。 swipeleft
執行沒有問題,但swiperight
將無法運行。
誰能提供任何指針?
如果我沒有完全弄錯e
(在回調事件中)有一個數組觸及移動瀏覽器。 每個觸摸事件都有一個元素。
這是一個例子:
document.addEventListener('touchmove', function(event) {
event.preventDefault();
var touch = event.touches[0];
console.log("Touch x:" + touch.pageX + ", y:" + touch.pageY);
}, false);
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.