jQueryMobile Jump Start
Practical jump start for learning how to use the jQueryMobile library. More information about the Java course I deliver can be found at java.course.lifemichael.com More information about the PHP course I deliver can be found at php.course.lifemichael.com More information about the FED course I deliver can be found at fed.course.lifemichael.com More information about the Scala course I deliver can be found at scala.course.lifemichael.com More information about the Android course I deliver can be found at android.course.lifemichael.com More information about the Kotlin course I deliver can be found at kotlin.course.lifemichael.com More information about the Swift course I deliver can be found at swift.course.lifemichael.com More information about the C++ course I deliver can be found at cpp.course.lifemichael.com More information about the Go course I deliver can be found at go.course.lifemichael.com More information about the CSS course I deliver can be found at css.course.lifemichael.com More information about the C# course I deliver can be found at csharp.course.lifemichael.com More information about the Python course I deliver can be found at python.course.lifemichael.com More information about the Angular course I deliver can be found at angular.course.lifemichael.com More information about the Node.js course I deliver can be found at nodejs.course.lifemichael.com More information about the Fullstack Development course I deliver can be found at fullstack.course.lifemichael.com
jQueryMobile Jump Start
- 1. Haim Michael December 20th, 2013 All logos, trade marks and brand names used in this presentation belong to the respective owners. You can watch the video clip at http://youtu.be/zFSTN8JnFEk. LifeMichael.com jQueryMobile Jump Start
- 2. ● Introduction to jQueryMobile ● Clean Semantic HTML ● Web Browsers Compatibility ● Platforms Compatibility ● HTML5 Capabilities ● Handling User Events ● Themes Framework ● The Codiqa Designer Tool ● jQueryMobile Alternatives ● Learning Resources ● Questions & Answers LifeMichael.com Table of Content
- 3. ● The jQueryMobile JavaScript library allows us to create a unified user interface that works across most smartphone web browsers and tablets. ● The jQueryMobile library uses the well known jQuery library. www.jquerymobile.com www.jquery.com ● www.jqueryui.com If you are not familiar with JavaScript you might want to check my JavaScript Jump Start. LifeMichael.com Introduction to jQueryMobile
- 4. <!DOCTYPE html> <html> <head> <title></title> <link rel="stylesheet" href= "http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" /> <script src="http://code.jquery.com/jquery-1.9.1.min.js"> </script> <script src= "http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"> </script> </head> <body> <div data-role="page"> <div data-role="header"> <h1>Simple List Demo</h1> </div> LifeMichael.com Introduction to jQueryMobile
- 5. <div data-role="content"> <ul data-role="listview" data-theme="c"> <li><a href="http://www.google.com">google</a></li> <li><a href="http://www.oracle.com">oracle</a></li> <li><a href="http://www.microsoft.com">microsoft</a></li> <li><a href="http://www.ibm.com">ibm</a></li> <li><a href="http://www.intel.com">intel</a></li> <li><a href="http://www.samsung.com">samsung</a></li> <li><a href="http://www.nokia.com">nokia</a></li> <li><a href="http://www.apple.com">apple</a></li> <li><a href="http://www.sony.com">sony</a></li> <li><a href="http://www.lenovo.com">lenovo</a></li> </ul> </div> <div data-role="footer"> <h4>lifemichael</h4> </div> </div> </body> </html> LifeMichael.com Introduction to jQueryMobile
- 7. ● The jQuery Mobile is built on top of a simple usage of clean semantic HTML. ● When the web browser supports CSS and JavaScript, jQueryMobile applies progressive enhancements techniques that transform the semantic page into a rich interactive user interface one. LifeMichael.com Clean Semantic HTML
- 8. ● The jQueryMobile library is compatible with most mobile web browsers. LifeMichael.com Web Browsers Compatibility
- 9. ● The jQueryMobile library is compatible with most mobile platforms. http://jquerymobile.com/gbs/ LifeMichael.com Platforms Compatibility
- 10. ● The jQuery Mobile utilizes HTML5 capabilities. Using jQueryMobile we indirectly exploit the power of HTML5. HTML5 Jump Start LifeMichael.com HTML5 Capabilities
- 11. ● The jQuery Mobile library supports new events relevant for mobile platforms, such as touching and dragging. Handling Touch Events Code Sample LifeMichael.com Handling User Events
- 12. ● We can create our own theme or use one of the many themes that were already created. ● The ThemeRoller provides us with a visual simple way for creating our own customized theme. http://jquerymobile.com/themeroller/ LifeMichael.com Themes Frameworks
- 13. ● Codiqa is a powerful drag-and-drop IDE for creating cross-platform mobile hybrid applications and websites. https://codiqa.com/ LifeMichael.com The Codiqa Designer Tool
- 15. ● http://www.jquerymobile.com This is jQueryMobile main website. It includes detailed documentation and links for other relevant resources. ● http://www.jqmgallery.com This website includes samples for hybrid applications for mobile telephone that were developed using jQueryMobile. ● http://abelski.lifemichael.com This website includes an online free course for learning how to use jQueryMobile. You will find it inside the JavaScript frameworks category. LifeMichael.com Learning Resources
- 16. ● Two courses you might find interesting include Software Engineering in PHP more info Android 4.4 Java Applications Development more info HTML5 Cross Platform Mobile Applications more info ● If you enjoyed my lecture please leave me a comment at http://speakerpedia.com/speakers/life-michael. Thanks for your time! Haim. LifeMichael.com Questions & Answers