所以我使用jquery mobile ui来做一个页面,向左/向右滑动,现在这对我不起作用,因为我只想滑动内容,而不是页面的entery body,我尝试使用data-role="content"
但它没有'不再工作了,data-role="page"
是否可以使用滑动动画,但仅适用于内容?
我有一些<article>
,我想向左/向右滑动它们……但我不想滑动标题和其他东西……只是中间部分。
如果可以的话,还要禁用那个愚蠢的 jquery 移动主题。
//乐
代码结构
<header data-role="header"> .... </header>
<section>
<!-- only this part I want to swipe, one article at a time -->
<article data-role="page"> ..... </article>
<article data-role="page"> ..... </article>
<article data-role="page"> ..... </article>
<article data-role="page"> ..... </article>
<!-- only this part I want to swipe, one article at a time -->
</section>
<footer> ... </footer>
$('article').bind("swipeleft", function(){
var nextpage = $(this).next('article[data-role="page"]');
// swipe using id of next page if exists
if (nextpage.length > 0) {
$.mobile.changePage(nextpage, {transition: "slide",
reverse: false}, true, true);
}
});
$('article').bind("swiperight", function(){
var prevpage = $(this).prev('article[data-role="page"]');
if (prevpage.length > 0) {
$.mobile.changePage(prevpage, {transition: "slide",
reverse: true}, true, true);
}
});