如何使用jQuery函數創建jQuery Mobile頁面幻燈片？

jQuery的功能（在其自己的作品）：如何使用jQuery函數創建jQuery Mobile頁面幻燈片？

$("#firstpage").live('pageinit', function (evt) { 
    $("#firstpage").bind("swipeleft", function (e) { 
     alert ("you swiped left!"); 
    }); 
});

jQuery Mobile的鏈接（也適用於自己的）：

<a href="#secondpage" data-transition="slide">GO TO PAGE 2</a>

那麼，如何將二者結合起來？謝謝！

來源

2012-08-02 orbwhacker

。

檢查jQuery Mobile的文檔
http://jquerymobile.com/demos/1.1.1/docs/api/methods.html

$("#firstpage").live('pageinit', function (evt) { 
    $("#firstpage").bind("swipeleft", function (e) { 
     $.mobile.changePage("#secondpage", { transition : 'slide'}); 
    }); 
});

來源

2012-08-03 07:04:28

謝謝，這就是我一直在尋找。由於顯而易見的原因，它不如原生應用程序那麼敏捷，但仍然有用。 – orbwhacker 2012-08-03 15:57:09

@orbwhacker如果你想響應，你可以實現它，但你必須使用'touchstart' /'touchmove' /'touchend'。退房swipejs.com，這是一些漂亮的代碼。 jQuery Mobile事件「swipeleft」/「swiperight」只是沒有響應。 – Jasper 2012-08-04 16:34:26

您可以使用$.mobile.changePage()，這是內部用於頁面之間轉換的內容。這裏有一個例子：

$(document).delegate("#firstpage", 'pageinit', function (evt) { 
    $(this).bind("swipeleft", function (e) { 
     $.mobile.changePage("#secondpage", { 
      transition : 'slide' 
     }); 
    }); 
}).delegate("#secondpage", 'pageinit', function (evt) { 
    $(this).bind("swiperight", function (e) { 
     $.mobile.changePage("#firstpage", { 
      transition : 'slide', 
      reverse : true 
     }); 
    }); 
});

這裏是一個演示：http://jsfiddle.net/QjUMh/

退房的文檔$.mobile.changePage，看看它擁有的所有選項：您可以使用$.mobile.changePage()方法做http://jquerymobile.com/demos/1.1.1/docs/api/methods.html

來源

2012-08-03 05:59:48 Jasper

如何使用jQuery函數創建jQuery Mobile頁面幻燈片？

回答

相關問題