左/右滑动非常适合在我的移动应用中的页面之间导航。
在某些页面上虽然我有一个元素(#timeline
),可以在iOS中使用原生动量滚动来水平滚动/拖动。
但是一旦我添加JQM滑动侦听器,任何水平滚动元素的尝试都会被忽略,而是尝试拖动div会触发页面更改。
我已尝试在JQM的mobileinit中修改($.event.special.swipe.scrollSupressionThreshold
),但这并没有帮助:即使价值很高,滚动速度也很慢且很可能会触发滑动事件。
解决此问题的最佳方法是什么?
页面位于:http://www.message-design.co.uk/CLO_guide_swipe/chapter_3.php
我的滑动代码在这里:
// Handler for navigating to the next page
function navnext( next ) {
$( ":mobile-pagecontainer" ).pagecontainer( "change", next + ".php", {
transition: "slide"
});
}
// Handler for navigating to the previous page
function navprev( prev ) {
$( ":mobile-pagecontainer" ).pagecontainer( "change", prev + ".php", {
transition: "slide",
reverse: true
});
}
// Navigate to the next page on swipeleft
$( document ).on( "swipeleft", ".ui-page", function( event ) {
// Get the filename of the next page. We stored that in the data-next
// attribute in the original markup.
var next = $( this ).jqmData( "next" );
// Check if there is a next page
if ( next ) {
navnext( next );
}
});
// Navigate to the next page when the "next" button in the footer is clicked
$( document ).on( "click", ".next", function() {
var next = $( ".ui-page-active" ).jqmData( "next" );
// Check if there is a next page
if ( next ) {
navnext( next );
}
});
// The same for the navigating to the previous page
$( document ).on( "swiperight", ".ui-page", function( event ) {
var prev = $( this ).jqmData( "prev" );
if ( prev ) {
navprev( prev );
}
});
$( document ).on( "click", ".prev", function() {
var prev = $( ".ui-page-active" ).jqmData( "prev" );
if ( prev ) {
navprev( prev );
}
});
});