Используйте пальцем, чтобы изменить URL, а также иметь контроль над направлением данных

Question

Поэтому я использую следующий jQuery, чтобы позволить пользователю проводить пальцем влево или вправо для перехода на разные страницы в одном и том же документе.

$('#main').bind('swiperight', function(){
    window.location = '#menu';
});
$('#main').bind('swipeleft', function(){
    window.location = '#showcase';
});
$('#showcase').bind('swiperight', function(){
    window.location = '#main';
});

Проблема в том, что я не контролирую направление данных. Было бы разумно, чтобы, когда пользователь проводит вправо, контент перемещался слева направо и наоборот.

Есть идеи?

Спасибо!

Answer 1

Вместо использования window.location, вы могли бы использовать это:

// swiperight function
$.mobile.changePage("#menu", "slide", true, true);

// swipeleft function
$.mobile.changePage("#showcase", "slide", false, true);

Логическое значение после строки "slide" определяет направление (вперед или назад).

Документы нафункция changePage: http://jquerymobile.com/test/docs/api/methods.html

Я нашел часть этого решения в этом посте: скользящий переход слева направо в jQuery Mobile

Answer 2

Попробуйте это:

$('#main').bind('swiperight', function(){
    $.mobile.changePage("#menu",{
        reverse: true,
        transition: "slide"
});
});

$('#main').bind('swipeleft', function(){
    $.mobile.changePage("#showcase",{
        transition: "slide"
});
});
$('#showcase').bind('swiperight', function(){
    $.mobile.changePage("#main",{
        reverse: true,
        transition: "slide"
});
});

Это работает для меня! :)