jQuery Mobile v1.3 最新情報 2013/03/16 ABC 2013 Spring Toru Yoshikawa (@yoshikawat)
jQuery Mobile 1.3 最新情報
Nov 01, 2014
Android Bazaar and Conference 2013 Spring の講演資料です。
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
- 1. jQuery Mobile v1.3 2013/03/16 ABC 2013 Spring Toru Yoshikawa (@yoshikawa_t)
- 2. Who? / Toru Yoshikawa@yoshikawa_t Google Developer Experts (Chrome) html5j.org/HTML5 jQuery Mobile Sublime Text 2 Japan Users Group allWeb/jQuery Mobile Blog: http://d.hatena.ne.jp/pikotea/
- 3. History jQuery Mobile v1.2 http://www.slideshare.net/yoshikawa_t/jquery-mobile-14844564jQuery Mobile 1.2 & Tips http://www.slideshare.net/yoshikawa_t/jquery-mobile-tips-20120719jQuery Mobile 1.1 & Tips http://www.slideshare.net/yoshikawa_t/jquery-mobile-tipsjQuery Mobile http://www.slideshare.net/yoshikawa_t/jquery-mobile-10578175
- 4. Agenda jQuery Mobile 1.3 jQuery Mobile 1.3 Panel (http://bit.ly/jqm130316)
- 5. jQuery Mobile 1.3 Web width:100% em
- 6. jQuery Mobile 1.3
- 7. Panel
- 8. Panel
- 9. Panel
Panel
- 10. Panel data-role="panel"data-position: left rightdata-display : overlay: Panel reveal: Panel push: PanelPage
- 11. Panel data-role="panel"data-swipe-close: true (default)data-dismissible: Panel true (default)data-animate: true (default)data-position-xed: Panel false (default)
- 12. Panel
- Menu1
- Menu2 ...
- 13. Panel
revealpush...
- 14. PanelJavaScript// Paneloptionsv1.3$(#menu).panel(open, options);// Panel$(#menu).panel(close);
- 15.
- 16. Column Toggle
- 17. Reow
- 18. Column Toggle
- 19. Column Toggle theadtbody No. 1 2 3 4 ......
- 20. data-role="table" class="ui-responsive" data-mode: columntoggle (default) reow class: table-stripe: table-stroke:
- 21. Column Toggle data-role="table" data-mode="columntoggle" data-priority: 1: 320px (20em) 2: 480px (30em) 3: 640px (40em) 4: 800px (50em) 5: 960px (60em) 6: 1,120px (70em) data-priority
- 22. Column Toggle data-role="table" data-mode="columntoggle"data-column-btn-text: "Columns..." (default)data-column-btn-theme: aedata-column-popup-theme: ae
- 23. No. 1 2 3 4 ......
- 24. Reow
- 25. Reow data-modereow No. 1 2 3 data-priority 4 ......
- 26. ReowReow100% @media (min-width: 35em) { .ui-table-reflow.ui-responsive { display: table; } }
- 27.
- 28.
- 29.
560px (35em)ABCD
- 30. @media all and (max-width: 480px) { .ui-responsive .ui-block-a, .ui-responsive .ui-block-b, .ui-responsive .ui-block-c, .ui-responsive .ui-block-d { width: 50%; float: left; }}
- 31.
- 32. Dual range sliderinput type="le" data-clear-btn="true"
- 33. slider2
- 34. Autocomplete
- a
- ab listviewlter
- abc UI
- abcd
- 35.
- 36. bars menu ui-icon-alt ui-icon-nodisc
- 37. ui-icon-altui-icon-nodisc
- 38. jQuery 1.92.0IE10/WP8jQuery MobileAPIDownload Builder ToolAndroid 2.xiOS 4
- 39. data-close-btn"right""left""none"http://view.jquerymobile.com/1.3.0/docs/widgets/dialog/1.4data-dismissible="false"http://view.jquerymobile.com/1.3.0/docs/widgets/popup/optgroupdata-divider-themeclassui-btn-rightui-btn-leftdata-corners
- 40. JavaScriptcontrolgroupcreatehttp://api.jquerymobile.com/controlgroup/Swipehttp://api.jquerymobile.com/swipe/hashchangepopstateNavigatehttp://stage.api.jquerymobile.com/navigate/History API$.mobile.navigatehttp://stage.api.jquerymobile.com/jQuery.mobile.navigate/http://api.jquerymobile.com/button/
- 41.
- 42. 1.1.21.2.1 1.3.11.420132201313 UIjQuery UI https://github.com/jquery/jquery-mobile/wiki/1.4-planning1.520132201346 1.620133201379 1.72013420131012
- 43. jQuery Mobile https://groups.google.com/group/jqm-jp/ jQuery Mobile
- 44. Thank you!! (@yoshikawa_t)
Related Documents
