Sign In | Subscribe
Start learning today, and be successful in your academic & professional career. Start Today!
Loading video...
This is a quick preview of the lesson. For full access, please Log In or Sign up.
For more information, please see full course syllabus of Adobe Dreamweaver CC
  • Discussion

  • Study Guides

  • Download Lecture Slides

  • Table of Contents

  • Related Books

Bookmark and Share

Start Learning Now

Our free lessons will get you started (Adobe Flash® required).
Get immediate access to our entire library.

Sign up for Educator.com

Membership Overview

  • Unlimited access to our entire library of courses.
  • Search and jump to exactly what you want to learn.
  • *Ask questions and get answers from the community and our teachers!
  • Practice questions with step-by-step solutions.
  • Download lesson files for programming and software training practice.
  • Track your course viewing progress.
  • Download lecture slides for taking notes.
  • Learn at your own pace... anytime, anywhere!

Building a jQuery Mobile Page

  • Dreamweaver can give you a jump start for building jQuery Mobile websites
  • We will not be creating a full-fledged website as that is beyond the scope of this course, there is a longer course on jQuery Mobile available on Educator.com
  • To create a new jQuery mobile page using Dreamweaver, go to File->New->Starter Templates
  • Select the Mobile Starters folder and you will see 3 different versions you can create
  • jQuery mobile pages require both the jQuery and jQuery mobile libraries in order to build the pages
  • These libraries can either be downloaded from a website on the internet, or you can store the files on your local drive
  • The CDN version will add a link to the library files residing on the internet
  • Microsoft, Google and jQuery all offer links to jQuery libraries if you do not want to install these files on your web server
  • The recommendation in the past was to always use the link on the internet because users may have already downloaded the library so it was said to speed up the page load time
  • That idea does not appear to actually be the case in the browser, so it is best to install a local version of these files that you can control, and you can test fully before updating
  • We will choose the last option, the jQuery Mobile with Theme (Local) version
  • This version contains 2 different CSS files, one that contains everything that jQuery Mobile needs and another that contains all the CSS for the built-in themes
  • These jQuery pages use the HTML5 Doctype
  • Create a new folder in the chapter files website site called jqm
  • Click the create button and save the page as index.html in the jqm folder in your site
  • Notice the various files that Dreamweaver is pulling in to create this page
  • You can use Dreamweaver to create a jQuery mobile web page to use as a starting point for building your jQuery mobile website

Building a jQuery Mobile Page

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.

  • Intro 0:00
  • Site Templates 0:52
    • Starter Templates
  • JQuery Mobile Versions 1:13
    • CDN
    • Local Versions
  • jQuery Mobile CSS Pages 3:58
    • Saving jQuery Mobile File
    • Downloading Dependent Files
  • Preview in Browser 6:48
  • jQuery Mobile Base Page 6:52