laurentiu macovei - jquerymobile
TRANSCRIPT
![Page 1: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/1.jpg)
Introduction to
Laurențiu MacoveiDotNetWise
[10th of November 2012]
![Page 2: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/2.jpg)
![Page 3: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/3.jpg)
=
+ + mobile + .
![Page 4: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/4.jpg)
Lightweight sizejQuery Mobile is 33kb + jQuery = 66kb
![Page 5: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/5.jpg)
OPEN SOURCE, FREE
![Page 6: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/6.jpg)
Just one among the others
http://wp.nu/mobilecompare
Sencha Touch Kendo UI
![Page 7: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/7.jpg)
Aggressively cross-platform, cross-browser
![Page 8: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/8.jpg)
![Page 9: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/9.jpg)
+
![Page 10: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/10.jpg)
Focused on progresive ehnancement and graceful degradation
![Page 11: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/11.jpg)
A-grade - Full enhanced experiencewith Ajax-based animated page transitions.
most browsers
![Page 12: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/12.jpg)
A-grade - Full enhanced experience with Ajax-based animated page transitions.
B-grade - Enhanced experience except without Ajax navigation features.
Blackberry 5.0*, Opera Mini 7, Nokia Symbian^3
![Page 13: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/13.jpg)
A-grade - Full enhanced experience with Ajax-based animated page transitions.
B-grade - Enhanced experience except without Ajax navigation features.
C-grade - Basic, non-enhanced HTML experience that is still functional
Blackberry 4.x, Windows Mobile, all non-CSS media queries
![Page 14: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/14.jpg)
Markup driven minimal code required to get up and
running
![Page 15: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/15.jpg)
Markup driven
![Page 16: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/16.jpg)
Add data-role to decorate elements
![Page 17: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/17.jpg)
Make the footer fixed
![Page 18: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/18.jpg)
Group max 5 buttons in a navbar
![Page 19: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/19.jpg)
Add data-theme=X to apply skins
![Page 20: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/20.jpg)
Add data-rel=back for back button
![Page 21: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/21.jpg)
![Page 22: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/22.jpg)
Add data-role=listview to lists
![Page 23: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/23.jpg)
![Page 24: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/24.jpg)
Add data-role to decorate elements
![Page 25: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/25.jpg)
Add round box text with ui-li-count
![Page 26: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/26.jpg)
Add aside text with class ui-li-aside
![Page 27: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/27.jpg)
Categories with data-role=list-divider
![Page 28: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/28.jpg)
Add data-inset=true for round lists
![Page 29: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/29.jpg)
Add data-filter to enable filtering
![Page 30: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/30.jpg)
Add data-role=fieldcontain in forms
![Page 31: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/31.jpg)
Organize elements with ui-grid and ui-block
![Page 32: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/32.jpg)
Add data-role=controlgroup to group checbokxes or radios
![Page 33: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/33.jpg)
Add data-role to decorate elements
![Page 34: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/34.jpg)
Add class ui-body and ui-body-x to create swatches
![Page 35: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/35.jpg)
Select element is self-enhanced
![Page 36: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/36.jpg)
Add class ui-body and ui-body-x to create swatches
![Page 37: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/37.jpg)
Disable system menu with data-native-menu=false
![Page 38: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/38.jpg)
Rotate the device for a different experience
![Page 39: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/39.jpg)
Every device is different
![Page 40: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/40.jpg)
![Page 41: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/41.jpg)
![Page 42: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/42.jpg)
![Page 43: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/43.jpg)
What’s not included in the boxSingle page templatesMulti page templatesDialogs and PopupsTransitions bweteen pagesAjax pages
![Page 44: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/44.jpg)
Demo LiveCodecamp Feedback application
![Page 45: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/45.jpg)
![Page 46: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/46.jpg)
released on 2 october, 2012
list of almost 200 contributors
![Page 47: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/47.jpg)
Contribute!
![Page 48: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/48.jpg)
Q & A
![Page 49: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/49.jpg)
![Page 50: Laurentiu Macovei - jQueryMobile](https://reader034.vdocument.in/reader034/viewer/2022052323/558a6749d8b42a544a8b4740/html5/thumbnails/50.jpg)
Diamond Sponsors
Platinum Sponsors Gold Sponsors
Training Partners Media Partners Other Partners