在Android应用程序的开发页面之间滑动

我知道这已经被问过了，但我不能得到他的任何工作例子。让幻灯片转换工作将所有页面作为单独的html文件工作似乎非常困难？脚本的next/prev部分如何知道下一个其他文件是哪一个？在Android应用程序的开发页面之间滑动

例如，index.html应滑动到01_welcome.html - 但它怎么知道它不是02_funds.html？

感谢您给予的任何启示。以下是我一直试图实施的脚本（由以前的答案提供）。

$('div.ui-page').live("swipeleft", function() { 
    var nextpage = $(this).next('div[data-role="page"]'); 
    if (nextpage.length > 0) { 
     $.mobile.changePage(nextpage, "slide", false, true); 
    } 
}); 
$('div.ui-page').live("swiperight", function() { 
    var prevpage = $(this).prev('div[data-role="page"]'); 
    if (prevpage.length > 0) { 
     $.mobile.changePage(prevpage, { 
      transition: "slide", 
      reverse: true 
     }, true, true); 
    } 
});

来源

2014-08-27 Jimbly2

上面的代码可与_multi页model_，为_single页model_，您可以添加自定义属性'数据下一=“foo”的'和'数据分组=“酒吧”'。这些自定义属性包含next/prev页面文件名。检索它们的值以更改页面。 btw使用哪种JQM版本？ – Omar 2014-08-28 05:53:05

谢谢奥马尔 - 我使用JQM 1.4.3所以我需要编码每一页 - 这不是问题，因为只有6页。我的JS很穷 - 你能建议那些自定义属性放在上面的代码中吗？还是会完全不同？ – Jimbly2 2014-08-28 06:57:54

在OP代码工作以及在多页型号环境，因为所有的页面（div的）存在于DOM。对于单页模型，您需要稍微调整代码，因为每个页面都是单个文件。另请注意，.live()已弃用，请改用.on()。

最简单的解决方案是为每个页面div添加自定义属性。

<div data-role="page" data-next-page="services" data-prev-page="about">

检索swipe上的自定义属性的值，然后加载目标页面。

$(document).on("swipeleft swiperight", function (event) { 
    var activePage = $.mobile.pageContainer.pagecontainer("getActivePage"), 
     nextPage = activePage.data("next-page"), 
     prevPage = activePage.data("prev-page"); 

    /* move to next page */ 
    if (event.type == "swipeleft" && nextPage) { 
     $.mobile.pageContainer.pagecontainer("change", nextPage + ".html"); 
    } 

    /* move to previous page */ 
    if (event.type == "swiperight" && prevPage) { 
     $.mobile.pageContainer.pagecontainer("change", prevPage + ".html", { 
      reverse: true 
     }); 
    } 
});

来源

2014-08-28 07:11:42 Omar

感谢奥马尔 - 非常有效：那么，我们有什么“服务”，它将是完整的标题，即“services.html”？ – Jimbly2 2014-08-28 07:25:14

@ Jimbly2不客气。测试它并让我知道如果您想要应用一些更改。编辑：确切地说，_services.html_是您要移动到的下一个页面，而_about.html_是之前的一个。 – Omar 2014-08-28 07:27:15

@ Jimbly2可能有完整的文件名'data-next-page =“services.html”'并从代码中移除'+。“html”'。我猜它看起来更好。 – Omar 2014-08-28 07:35:57

在Android应用程序的开发页面之间滑动

回答

相关问题