jQuery Mobile忽略了对可滚动元素

时间:2015-10-22 11:20:40

标签: jquery ios jquery-mobile

左/右滑动非常适合在我的移动应用中的页面之间导航。

在某些页面上虽然我有一个元素(#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 );
    }
});
});

0 个答案:

没有答案