Iniciando com Jquery

download Iniciando com Jquery

of 21

  • date post

    14-Dec-2014
  • Category

    Technology

  • view

    46
  • download

    0

Embed Size (px)

description

Tutorial iniciando com jquery

Transcript of Iniciando com Jquery

  • 1. Quem esse cara? Formado em Tecnologia de Sistemas pra Internet. Programa desde os 13 anos. Programador back-end. J trabalhou em empresas, rgos governamentais e startups como: INCRA, 3Up Tecnologia, Onsee Digital Signage. Atualmente CEO/Founder da Stoodos.
  • 2. O que vamos ver? O que jQuery? Porque us-lo Para que us-lo? Como usa-lo? Seletores. jQuery e o CSS. Efeitos em jQuery. Ajax com jQuery. Bnus: Principais plugins do jQuery.
  • 3. O que jQuery? Criada por John Resig. Biblioteca JavaScript. Uma forma simples de escrever cdigos JavaScript. Free MIT e GPL Conformidade com os padres web. www.jquery.com
  • 4. Por que us-lo? JavaScript: jQuery
  • 5. Para que us-lo Adicionar efeitos visuais e animaes. Acessar e manipular o HTML. Implementar cdigos Ajax. Prover interatividade. Alterar contedos. Compatibilidade com navegadores. Simplificar tarefas JavaScript.
  • 6. Como us-lo? Baixar o jQuery em www.jquery.com Incluir o arquivo .js em seu projeto. Chamar o jQuery no cabealho do HTML Ex.: Programar em Jquery.
  • 7. Alguns adendos Construtor $() ou jQuery(). Encadeamento: Ex.:
  • 8. Seletores Seletores CSS 1-3 funcionam em jQuery. O jQuery possui alguns seletores prprios. http://api.jquery.com/category/selectors/ Ex. de seletores CSS: Ex. de seletores prprios:
  • 9. Eventos Mesmos do JavaScript. blur(), change(), click(), dbclick(), focus(), hover(), keydown(), keypress(), keyup(), load(), select(), submit() http://api.jquery.com/category/events/ Ex.:
  • 10. jQuery e o CSS. Muito simples manipular CSS por jQuery. Ex.:
  • 11. Efeitos em jQuery. Mtodos que possibilitam a criao de efeitos customizados. Mtodos com efeitos nativos.
  • 12. Efeitos em jQuery. animate() - Criar animaes personalizadas. Ex.:
  • 13. Efeitos em jQuery. delay() - Seta um tempo de espera entre execues. Ex.: fadeIn(), fadeOut(), fadeToggle() Aparecer e desaparecer. Ex.:
  • 14. Efeitos em jQuery. hide(), show(), toggle() Ex.: slideDown(), slideUp(), slideToggle() Ex.:
  • 15. Ajax com jQuery. Muito, muito, mas muito mais simples mesmo que JavaScript puro. Muito mais organizado que em JavaScript puro.
  • 16. Ajax com jQuery. load() L dados servidor e os carrega no elemento HTML selecionado. Ex.: ajax() Realiza requisies ajax. Ex.:
  • 17. Plugins do jQuery O que so? Cdigos jQuery para ajudar o desenvolvedor a fazer algo (validar formulrios, upload de arquivos..). Vantagem de ter muita coisa boa j implementada. Encurta o tempo de desenvolvimento.
  • 18. Como usar um plugin? Download dos arquivos do plugin (imagens, .js, .css, .swf...) Chamar os arquivos necessrios na pgina (.js, .css ) Utilizar o plugin.
  • 19. Bons plugins jQuery Validate Validar formulrios Fancybox Lightbox genrico jQuery UI Interaes com o usurio MeioMask Mscaras (CPF, Telefone ...)
  • 20. Contatos @tiagobutzke tiago@stoodos.com