Question

我的导航标题中有一个小条形按钮，在单击时打开面板，但是如何制作它以便当我从应用程序中间向右滑动时，它会打开左侧面板？你可以在很多原生应用上看到这个，包括Facebook。谢谢你的帮助！

Answer 1

我认为这是您想要的（您可能希望为您的滑动区域优化选择器） -

$('body').on('swiperight', function () {
    $('#defaultpanel').panel('open', '');
});

$('body').on('swipeleft', function () {
    $('#defaultpanel').panel('close');
});

jsFiddle Demo

Answer 2

聆听滑动事件swipeleft和swiperight，然后打开面板$('#id').panel('open')。

<强> Demo

$(document).on('swipeleft swiperight', function (e) {
  if (e.type == 'swiperight') {
    $('#left').panel('open');
  }
  if (e.type == 'swipeleft') {
    $('#right').panel('open');
  }
});

Answer 3

$( document ).on( "pageinit", "#demo-page", function() {
    $( document ).on( "swipeleft swiperight", "#demo-page", function( e ) {
        // We check if there is no open panel on the page because otherwise
        // a swipe to close the left panel would also open the right panel (and v.v.).
        // We do this by checking the data that the framework stores on the page element (panel: open).
        if ( $.mobile.activePage.jqmData( "panel" ) !== "open" ) {
            if ( e.type === "swipeleft"  ) {
                $( "#right-panel" ).panel( "open" );
            } else if ( e.type === "swiperight" ) {
                $( "#left-panel" ).panel( "open" );
            }
        }
    }); });

这是文档： http://view.jquerymobile.com/1.3.0/docs/examples/panels/panel-swipe-open.php#&ui-state=dialog

使用jQuery Mobile在中间滑动打开面板？

3 个答案: