1

I want to be able to slide back to the previous page within a javascript function (android/HTML5 project). I can get back to the previous page through history.back(), however, this code will not slide back.

Is it possible to make it do the sliding as well?

Daniel
  • 20,420
  • 10
  • 92
  • 149

1 Answers1

3

Swipe solution

Here's a working example: http://jsfiddle.net/Gajotres/ru3D3/

$(document).off('swipeleft').on('swipeleft', 'article', function(event){    
    var nextpage = $.mobile.activePage.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);
    }     
});

$(document).off('swiperight').on('swiperight', 'article', function(event){      
    history.back();
    return false;
    event.handled = true;
});

This code is used to go back to previous page:

history.back();
return false;

In this line:

$(document).off('swiperight').on('swiperight'

.off(..) is used to prevent multiple swipe event binding during the page transitions. If you have more questions do not hesitate to ask.

Button solution:

Working example also here: http://jsfiddle.net/Gajotres/ru3D3/

$(document).on('pagebeforeshow', '[ data-role="page"]', function(){  
    $(document).off('click touchStart').on('click touchStart', '#slide-back-btn', function(){       
        history.back();
        return false;       
    });    
});           
Community
  • 1
  • 1
Gajotres
  • 57,309
  • 16
  • 102
  • 130
  • 1
    setting `$.mobile.changePage("../myPage#myTag", { transition: 'slide', reverse: true });`did the trick – Daniel Apr 02 '13 at 13:43