Presentacion diseño web con jquery
6 recomendaciones2,719 vistas
El documento habla sobre las tendencias de diseño web para 2012, incluyendo el uso de grids fluidos, diseños responsivos y animaciones CSS3. También discute los recursos de jQuery que son útiles para el diseño web interactivo, como menús dinámicos, animaciones y efectos 3D. Proporciona varios enlaces a ejemplos y plugins de jQuery. Finalmente, presenta tres casos prácticos de sitios web que utilizan jQuery de maneras interesantes.
Presentacion diseño web con jquery
- 1. Diseño web con jQuery Miguel Angel Alvarez DesarrolloWeb.com @alvarezmiguelan
- 2. 1) Tendencias diseño 2012 2) Recursos jQuery en el diseño web 3) Casos prácticos de uso
- 4. zzzzz
- 6. jQuery es la esencia de la vida
- 10. Menos Flash, hover, pixel perfect Más Responsive Design
- 12. Aplicaciones HTML5 para dispositivos móviles
- 13. Animaciones CSS3 http://www.anthonycalzadilla.com/ css3-ATAT/ http://tutorialzine.com/2009/11/ hovering-gallery-css3-jquery/
- 14. Scroll Parallax – Sitios de 1 página http://www.redirectdigital.com.br/ http://www.hyundai-veloster.eu/
- 16. Diseños con componentes 3D
- 17. Slides – presentación de diapositivas
- 18. Infografías
- 19. Aplicaciones en el navegador
- 20. Tipografías
- 21. 2) Recursos jQuery en el diseño web Diseño Programación
- 22. 2) Recursos jQuery en el diseño web Interacción + comportamientos
- 23. Menús dinámicos, ¿Solo CSS3? http://css3menu.com/ http://codecanyon.net/item/menu-with-css3-effects-and-notification-bubbles/1147974 http://net.tutsplus.com/tutorials/html-css-techniques/how-to-create-a-drop-down-nav- menu-with-html5-css3-and-jquery/
- 24. Animaciones CSS3 http://transformjs.strobeapp.com/ http://ricostacruz.com/jquery.transit/
- 25. Animaciones “cargando” CSS3 + jQuery http://fgnass.github.com/spin.js/
- 26. Interfaces de usuario para apps http://jqueryui.com http://www.kendoui.com/ http://wijmo.com/
- 27. Formularios, campos mejorados, validación, ajax, etc. http://demos.kendoui.com/web/validator http://jquery.malsup.com/form/ http://textextjs.com/
- 28. Slides - Presentaciones http://slidesjs.com/ http://nivo.dev7studios.com/ http://thiagosf.net/projects/jquery/skitter/ http://www.slidedeck.com/ http://buildinternet.com/project/supersized/
- 29. Efectos 3D http://transformjs.strobeapp.com/ http://hakim.se/projects/reveal-js http://lab.smashup.it/flip http://www.zachstronaut.com/projects/rotate3di/
- 30. Tipografías http://letteringjs.com/ http://fittextjs.com/ http://workshop.rs/2010/01/jqisotext-jquery-text-effect-plugin/
- 31. Scroll Parallax http://jonraasch.com/blog/scrolling-parallax-jquery-plugin http://www.davecranwell.com/content/jquery-scroll-parallax-plugin http://webdev.stephband.info/parallax.html https://github.com/imakewebthings/jquery-waypoints/
- 32. 3) Casos de uso
- 34. http://www.intacto10years.com/ jQuery QueryLoader jQuery Plugin https://github.com/Gaya/QueryLoader2 scrollTo jQuery Plugin http://flesler.blogspot.com/2007/10/jqueryscrollto.html scrolling Paralax jQuery Plugin http://jonraasch.com/blog/scrolling-parallax-jquery-plugin
- 36. http://www.reverenddanger.com jQuery, Modernizr, jQueryUI, Easing Flip jQuery Plugin jquery-animate-css-rotate-scale https://github.com/zachstronaut/jquery-animate-css-rotate-scale scrollTo jQuery Waypoints https://github.com/imakewebthings/jquery-waypoints/ Typekit
- 41. ¿Diseño?