Intro j query_mobile_mojo
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share

Intro j query_mobile_mojo

  • 951 views
Uploaded on

 

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
951
On Slideshare
388
From Embeds
563
Number of Embeds
4

Actions

Shares
Downloads
3
Comments
0
Likes
0

Embeds 563

http://www.mojocat.com 544
http://mojocat.com 16
http://www.linkedin.com 2
https://www.linkedin.com 1

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide
  • Measurement - Tin Can
  • JQuery is mobile web and app ready

Transcript

  • 1. Jeff Tillett@mojotillett
  • 2. Introduction to thejQuery Mobile Framework
  • 3. ObjectivesHave an understanding of why jQuery Mobileframework is of importance and understand thebasics of how it works.
  • 4. What is onyour toolbelt?
  • 5. Learning 2.0 and beyondtools design process • Agile • Rapid development tools • HTML 5 • Social
  • 6. JQuery is agreatjumping offpoint formobile
  • 7. JQuery is agreatjumping offpoint formobile
  • 8. What is jQuery MobilejQuery Mobile is a touch-optimized webframework (additionally known as aJavaScript library or a mobile framework)
  • 9. A unified, HTML5-based user interfacesystem for all popular mobile deviceplatforms
  • 10. Write less, do more!
  • 11. jquerymobile.comStart here first!
  • 12. Some great templatesjqmgallery.com
  • 13. ToolsEasy WYSIWYG tool you can build andthen download the code
  • 14. Lets look at some codeBasic Structure (Head)<!DOCTYPE html><html><head><meta charset="UTF-8"><title>jQuery Mobile Web App</title><link href="jquery.mobile-1.0a3.min.css" rel="stylesheet" type="text/css"/><scriptsrc="jquery-1.5.min.js" type="text/javascript"></script><script src="1.0a3/jquery.mobile-1.0a3.min.js" type="text/javascript"></script></head>
  • 15. Here is the key files/librariesjquery.mobile.cssjquery.jsjquery.mobile.js
  • 16. Lets look at some code Basic Structure (body)<body><div data-role="page" id="page"><div data-role="header"><h1>Page One</h1> </div><div data-role="content"><ul data-role="listview"><li><a href="#page2">Page Two</a></li><li><a href="#page3">Page Three</a></li><li><a href="#page4">Page Four</a></li> </ul></div> <div data-role="footer"><h4>Page Footer</h4></div></div></body></html>
  • 17. Actinglike andAPP
  • 18. The JQuery Mobileframework iscompatible with othermobile app frameworksand platforms such asPhoneGap
  • 19. PhoneGapis an open-source mobile developmentframework that enables softwareprogrammers to build applications formobile devices using JavaScript, HTML5and CSS3, instead of device specificlanguages such as Objective-C
  • 20. Now letstake adeeperdive!
  • 21. Jeff Tillettwww.mojotillett.com
  • 22. Scan this QRcode for acopy of thispresentation
  • 23. The end!
  • 24. Training Learning Learning 2.0