Andrés Deza V. http://twitter.com/advillacorta
<ul><ul><li>Sistema de Interfaz unificado. </li></ul></ul><ul><ul><li>Jquery y Jquery UI como base </li></ul></ul><ul><ul>...
 
<ul><ul><li>Data Roles </li></ul></ul><ul><ul><li>Pages and Dialogs </li></ul></ul><ul><ul><li>Themes </li></ul></ul><ul><...
<ul><li>page </li></ul><ul><li>header </li></ul><ul><li>footer </li></ul><ul><li>navbar </li></ul><ul><li>button </li></ul...
<ul><ul><li>Jquery Mobile viene con 5 temas predeterminados. </li></ul></ul><ul><ul><li>data-theme=a,b,c,d,e </li></ul></u...
<ul><ul><li>Se puede crear un botón agregando data-role=”button” a una etiqueta botón  </li></ul></ul><ul><ul><li>button t...
<ul><ul><li>Se puede crear una lista de botones </li></ul></ul><ul><ul><li>Por defecto la lista de botones no tienes un &q...
<ul><ul><li>List view más avanzados. </li></ul></ul>
http://code.google.com/p/training-samples
Upcoming SlideShare
Loading in...5
×

JQuery Mobile - Agile Open Lima IV

692

Published on

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

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
692
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

JQuery Mobile - Agile Open Lima IV

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

×