In this course, our instructor Candyce Mairs discusses jQuery Mobile pages. This lesson demonstrates how to customize the pages of your jQuery Mobile site and discusses how to upgrade your version of jQuery Mobile.
We will take a look at a jQuery Mobile html page to get an understanding of how a jQuery Mobile page is set up which is very different than a standard web page
Once a jQuery Mobile page has been created and saved, you will see additional files have been added to the root folder of your site within a folder called jquery-mobile
Look in the related files toolbar and you will see a jQuery file and 2 jQuery Mobile files, one for .css files and the other for .js files
These libraries are updated often, so you may want to go out to the jQuery website to update these files once you become more familiar with jQuery Mobile to get a more recent version of these files
Those are the files that this page needs in order to work correctly and those files need to be uploaded to the web server
Take a look at the new jQuery Mobile page, it is structured unlike any other web page you have probably worked with, this one page contains all the information for the entire mobile site
That concept does take some getting used to! Each page contains a header, a content area, and a footer
We will change the headers on all the pages:
Page one to Tranquil Travel
Page two to Destinations
Page three to Specials
Page four to About Us
Click on Live view and view the page
Go ahead and add information within the four pages and view it in Live View or the browser to see the changes
Be sure to make the browser window narrow to get a better idea of how it would look on a mobile device
jQuery Mobile Pages
Lecture Slides are screen-captured images of important points in the lecture. Students can download and print out these lecture slide images to do practice problems as well as take notes while watching the lecture.
Educator.com recommends Adobe Dreamweaver CC to use with our Dreamweaver CC course. Adobe Dreamweaver CC is the leading all-in-one visual development tool used by web designers and developers worldwide to create, publish, and manage their websites and mobile content. Membership includes the full version of Dreamweaver CC to download, install, and run on your computer. You will get immediate access to all the latest updates and new features as soon as they're released.