Adventures in jQuery Mobile
Upcoming SlideShare
Loading in...5
×
 

Adventures in jQuery Mobile

on

  • 808 views

This was my Portfolio presentation detailing my first experience developing with jQuery Mobile. This presentation was given in June of 2011 at Portland State University.

This was my Portfolio presentation detailing my first experience developing with jQuery Mobile. This presentation was given in June of 2011 at Portland State University.

Statistics

Views

Total Views
808
Views on SlideShare
808
Embed Views
0

Actions

Likes
0
Downloads
12
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Apple Keynote

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n

Adventures in jQuery Mobile Adventures in jQuery Mobile Presentation Transcript

  • Adventures in jQuery MobileAmber Brucker6/6/11
  • Hi! I’m Amber. @AmberBrucker
  • Hi! I’m Amber. @AmberBrucker✤ I’m a web administrator at Retail Micro
  • Hi! I’m Amber. @AmberBrucker✤ I’m a web administrator at Retail Micro✤ Received an Associate’s in Multimedia in 2008
  • Hi! I’m Amber. @AmberBrucker✤ I’m a web administrator at Retail Micro✤ Received an Associate’s in Multimedia in 2008✤ Followed up by a Bachelor’s in Project Management in 2009
  • Hi! I’m Amber. @AmberBrucker✤ I’m a web administrator at Retail Micro✤ Received an Associate’s in Multimedia in 2008✤ Followed up by a Bachelor’s in Project Management in 2009✤ Certified in Digital Marketing Strategies
  • What is Kitty Kaddy?
  • What is Kitty Kaddy?✤ The original Kitty Kaddy was a single-page site created from a mockup powered by a jQuery Plugin, HTML, and CSS.
  • What is Kitty Kaddy?✤ The original Kitty Kaddy was a single-page site created from a mockup powered by a jQuery Plugin, HTML, and CSS.✤ It was suggested by several to create a mobile version of the site.
  • http://samuraiop.com/sites/hipstercat
  • http://samuraiop.com/sites/hipstercat
  • Challenges
  • Challenges✤ I didn’t know JavaScript or jQuery
  • Challenges✤ I didn’t know JavaScript or jQuery✤ I didn’t know jQuery Mobile
  • Challenges✤ I didn’t know JavaScript or jQuery✤ I didn’t know jQuery Mobile✤ How hard could it be - What, me worry?
  • Some Reality
  • Some Reality✤ I was taking a Javascript class concurrently with Portfolio
  • Some Reality✤ I was taking a Javascript class concurrently with Portfolio✤ I am excellent with code
  • Some Reality✤ I was taking a Javascript class concurrently with Portfolio✤ I am excellent with code✤ I had two devices to test a mobile site with
  • Time to go to work!
  • Time to go to work!
  • Requirements of the Project
  • Requirements of the Project ✤ It had to be touch-enabled
  • Requirements of the Project ✤ It had to be touch-enabled ✤ It had to be simple, elegant, yet mine
  • Requirements of the Project ✤ It had to be touch-enabled ✤ It had to be simple, elegant, yet mine ✤ It had to swipe to change images
  • Requirements of the Project ✤ It had to be touch-enabled ✤ It had to be simple, elegant, yet mine ✤ It had to swipe to change images ✤ It had to loop images
  • The Swipe
  • The Swipe ✤ To start, I found a code snippet that registered actions on a touch-enabled device.
  • The Swipe ✤ To start, I found a code snippet that registered actions on a touch-enabled device.
  • The Swipe ✤ To start, I found a code snippet that registered actions on a touch-enabled device. ✤ I used swipeleft and swiperight since those would be the most common actions when changing images.
  • The Counter
  • The Counter ✤ Todd wrote a count expression for me.
  • The Counter ✤ Todd wrote a count expression for me.
  • The Counter ✤ Todd wrote a count expression for me. ✤ The counter noted items in an implicit array, from 0 to 4.
  • The Counter ✤ Todd wrote a count expression for me. ✤ The counter noted items in an implicit array, from 0 to 4.
  • The Counter ✤ Todd wrote a count expression for me. ✤ The counter noted items in an implicit array, from 0 to 4. ✤ The console told me where it was in the array.
  • The Array
  • The Array✤ I added an explicit array with the names of the divs I needed to navigate to.
  • The Array✤ I added an explicit array with the names of the divs I needed to navigate to.✤ The console listed back to me the names I had given the items in the array.
  • The Array✤ I added an explicit array with the names of the divs I needed to navigate to.✤ The console listed back to me the names I had given the items in the array.
  • The changePage
  • The changePage✤ I had to reference jQuery Mobile’s documentation to figure out how to change pages.
  • The changePage✤ I had to reference jQuery Mobile’s documentation to figure out how to change pages.
  • Did I do it? Let’s Find out!http://samuraiop.com/sites/mobile
  • I did it!A very happy ending.
  • I did it!A very happy ending.