QNimate

  • CoursesVideos
  • WP PremiumPlugins
  • DemosLab
  • Home
  • QIdea
  • QTrack
Home Carbon Ads Multiple Pages In Phonegap

Multiple Pages In Phonegap

One of the first thing that comes into mind of new phonegap developers is how to create multiple pages. Basically there are two ways to create it:

  1. Using anchor link: We can have multiple HTML files in our www directory and link them using anchor tags. This is the same way pages in website are linked. It takes time for the webview to load and render a new document therefore it will have a bad user experience and your phonegap app will behave like a 100% web app.
  2. Using div tags: We can have multiple div tags and each of these divs will behave like a new page. Using javascript we can hide and display them. We can display only one div tag at a time. This method make the phonegap app behave like a native app and all the phonegap apps out there use this method only.

    Let’s see a sample demo of this method:

    If you are too lazy to write code for this then you can use jQuery Mobile multiple pages functionality. jQuery will handles all page transitions for you.

    Here is an example of multiple pages using jQuery mobile:

Jul 19, 2014Narayan Prusty
CSS3 :before and :after Psuedo-Elements and Generated ContentCreating Cascading Grid Layouts Using Masonry
Comments: 1
  1. Ben
    6 years ago

    Apart from stating the obvious I think this was a helpfull article for those who are starting with mobile developpement. Also, it was a good choice for not trying to push jquery mobile down the reader’s throat. Well done! :)

    ReplyCancel

Leave a Reply to Ben Cancel reply

To create code blocks or other preformatted text, indent by four spaces:

    This will be displayed in a monospaced font. The first four
    spaces will be stripped off, but all other whitespace
    will be preserved.
    
    Markdown is turned off in code blocks:
     [This is not a link](http://example.com)

To create not a block, but an inline code span, use backticks:

Here is some inline `code`.

For more help see http://daringfireball.net/projects/markdown/syntax

Narayan Prusty

I am a software engineer specialising in Blockchain, DevOps and Go/JavaScript. This is my personal blog where I write about things that I learn and feel interesting to share.

8 years ago 2 Comments Cordova
Share this
0
GooglePlus
0
Facebook
0
Twitter
0
Linkedin
Related Articles
  • Intercepting Android Back Button In Intel XDK
  • Typing Effect using JavaScript
  • Phonegap Refresh Page
  • Create a Music Player App using Intel XDK
  • Record Microphone Audio using Intel XDK
Our Sponsor
My Books

2014 - 2015 © QNimate
All tutorials MIT license