Let's see a quick example of how to use jQuery Mobile in a PhoneGap application. You can make any HTML page mobile friendly by using jQuery Mobile. We will create a simple app to show multiple entries in the page as a list and show some footer menus.
To start with, we need to download jQuery and jQuery Mobile components and place them in our project's JS/CSS directory. jQuery is a single JavaScript file and jQuery Mobile includes both a JavaScript file and a CSS file. We need to include them both in our app's HTML page.
Include the CSS file at the top of the HTML page, right above the
</head>tag:<link rel="stylesheet" href="css/jquery.mobile-1.4.4.min.css" />
Include the JavaScript files at the bottom of the page, right above the
</body>tag:<script src="js/jquery-1.11.1.min.js"></script> <script src="js/jquery.mobile-1.4.4.min.js"></script>
In jQuery Mobile, you define a page section by assigning the...