Search code examples
javascriptjqueryhtmlgesture

Navigate to page based on swipe


I have two pages: index.html and right.html.

What kind of a code is required, to go to right.html from index.html by swiping the screen horizontally?

I am using jQuery Mobile

$(function()
{
    $(document).on( "swipeleft", swipeleftHandler );

    function swipeleftHandler( event )
    {
        // What is the code that should come here?
        // And how can I design it so index.html slides to left 
        // and right.html comes to the middle?
    }
});

Solution

  • You need to prefetch the page and then change the page as you using jquery, so your code will be something like this:

        $(document).on("swipeleft", "#indexId", function() {
            $.mobile.loadPage("right.html");
            $.mobile.changePage("right.html", { transition: "slide" });
        });