How do you make an application that moves pages up, down, left, and right by swipe?

I'm a beginner who just started using Monaca.

I'd like to create an app that moves pages up, down, left, and right by swiping, but what should I do?

It's like swiping the "Onsen UI Minimal Template" button operation.

I would appreciate your advice.

monaca

2022-09-30 19:28

1 Answers

I solved myself.Write down the outline of the method for those who follow you.

1)In index.html body tag

<ons-navigator var="myNavigator" page="page001.html">/ons-navigator>

2) page001.html

<ons-gesture-detector>
    <ons-page>
        <div class="container"></div>
    </ons-page>
</ons-gesture-detector>

3) index.html

ons.ready(function(){

    /* Swipe to Previous Page*/
    $(document).on('swiperight', '.container', function(event){});

    /* Swipe to the next page*/
    $(document).on('swipeleft', '.container', function(event){
      myNavigator.pushPage("page002.html"); 
    }); 
}

2022-09-30 19:28

If you have any answers or tips

Popular Tags

python x 4647

android x 1593

java x 1494

javascript x 1427

c x 927

c++ x 878

ruby-on-rails x 696

php x 692

python3 x 685

html x 656