Introduction to the jQuery mobile framework

Introduction to the jQuery mobile framework

• 1.
  by RishabhRaowordpress.com/rishabhsrao@rishabhsraogithub.com/rishabhsrao
• 2.
  Today’s planIntroductionExploring aroundGettingstartedDeep diveDiscussionsResources
• 3.
  IntroductionWhat is jQuerymobile and why is it so awesome?
• 4.
  Cross-device
• 5.
  Cross-browser
• 6.
  Other featuresTouch-optimizedjQuery andjQuery UI foundationLightweightProgressive enhancementFlexibleThemeable
• 7.
  Exploring aroundA firstlook at jQuery mobile
• 8.
  UI componentsPage templatesDialogsHeaderand footer barsNavigation barsForm elementsCollapsible content blocksLists
• 9.
  UI components: Acloser look(see http://jquerymobile.com/demos)
• 10.
  Getting startedCreating yourfirst jQuery mobile UI component
• 11.
  Creating a buttonIt'sthis simple:<a href="home.html" data-role="button"> Link button</a>
• 12.
  Creating a buttonThisis what you get:
• 13.
  Creating a navigationbarThe navigation bar's code looks like this:<div data-role="navbar"> <ul> <li><a href="a.html" class="ui-btn-active">One</a></li> <li><a href="b.html">Two</a></li></ul></div><!-- /navbar -->
• 14.
  Creating a navigationbarThis is what you get:
• 15.
  Deep diveHands-on withjQuery mobile
• 16.
  Hands-on session(not coveredin this presentation, yet)
• 17.
  DiscussionsThere are nodumb questionsFeel free to ask
• 18.
  ResourcesBunch of usefullinks, books and other goodies
• 19.
  Resourcesjquerymobile.comjquery.comjqueryui.comjqmgallery.comwww.filamentgroup.com@jquery, @jqueryui, @jquerymobilewww.slideshare.net/eljefe/jquery-mobile-for-fun-and-profitforum.jquery.com/jquery-mobile
• 20.
  Thank youThat's allfolks