• Save
JQuery Mobile - Agile Open Lima IV
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share

JQuery Mobile - Agile Open Lima IV

  • 924 views
Uploaded on

Presentacion de la sesion de JQuery Mobile del Agile Open Lima IV

Presentacion de la sesion de JQuery Mobile del Agile Open Lima IV

More in: Education
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
924
On Slideshare
924
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
0
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Andrés Deza V. http://twitter.com/advillacorta
  • 2.
      • Sistema de Interfaz unificado.
      • Jquery y Jquery UI como base
      • Framework touch HTML5 optimizado.
  • 3.  
  • 4.
      • Data Roles
      • Pages and Dialogs
      • Themes
      • Buttons (icon sets)
      • Toolbars (Header & Footer)
      • List View Control
      • Y mucho más…
      • http://jquerymobile.com
  • 5.
    • page
    • header
    • footer
    • navbar
    • button
    • listview
    • fieldcontain
  • 6.
      • Jquery Mobile viene con 5 temas predeterminados.
      • data-theme=a,b,c,d,e
      • Aplica a:
        • Páginas
        • Botones
        • Toolbars
  • 7.
      • Se puede crear un botón agregando data-role=”button” a una etiqueta botón
      • button tag, un tag, o input type=submit|button|reset|image
      • Se puede agregar un icono en el botón usando data-icon=” icon-name ”
      • Por defecto el icono va a la derecha pero se puede cambiar especificando data-iconpos.
  • 8.
      • Se puede crear una lista de botones
      • Por defecto la lista de botones no tienes un "padding" definido para incluirlo en la barra se debe agregar    class="ui-bar"
      • <div data-role=&quot;footer&quot; class=&quot;ui-bar&quot;> <a href=&quot;index.html&quot; data-role=&quot;button&quot; data-icon=&quot;delete&quot;>Remove</a> <a href=&quot;index.html&quot; data-role=&quot;button&quot; data-icon=&quot;plus&quot;>Add</a> <a href=&quot;index.html&quot; data-role=&quot;button&quot; data-icon=&quot;arrow-u&quot;>Up</a> <a href=&quot;index.html&quot; data-role=&quot;button&quot; data-icon=&quot;arrow-d&quot;>Down</a> </div>
  • 9.
      • List view más avanzados.
  • 10. http://code.google.com/p/training-samples