Iniciando com Jquery

282 visualizações

Publicada em

Tutorial iniciando com jquery

Publicada em: Tecnologia
0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
282
No SlideShare
0
A partir de incorporações
0
Número de incorporações
1
Ações
Compartilhamentos
0
Downloads
12
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Iniciando com Jquery

  1. 1. Quem é esse cara?  Formado em Tecnologia de Sistemas pra Internet.  Programa desde os 13 anos.  Programador back-end.  Já trabalhou em empresas, órgãos governamentais e startups como: INCRA, 3Up Tecnologia, Onsee Digital Signage.  Atualmente é CEO/Founder da Stoodos.
  2. 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. Bônus:  Principais plugins do jQuery.
  3. 3. O que é jQuery?  Criada por John Resig.  Biblioteca JavaScript.  Uma forma simples de escrever códigos JavaScript.  Free – MIT e GPL  Conformidade com os padrões web.  www.jquery.com
  4. 4. Por que usá-lo?  JavaScript:  jQuery
  5. 5. Para que usá-lo  Adicionar efeitos visuais e animações.  Acessar e manipular o HTML.  Implementar códigos Ajax.  Prover interatividade.  Alterar conteúdos.  Compatibilidade com navegadores.  Simplificar tarefas JavaScript.
  6. 6. Como usá-lo?  Baixar o jQuery em www.jquery.com  Incluir o arquivo .js em seu projeto.  Chamar o jQuery no cabeçalho do HTML Ex.:  Programar em Jquery.
  7. 7. Alguns adendos  Construtor $() ou jQuery().  Encadeamento: Ex.:
  8. 8. Seletores  Seletores CSS 1-3 funcionam em jQuery.  O jQuery possui alguns seletores próprios.  http://api.jquery.com/category/selectors/ Ex. de seletores CSS: Ex. de seletores próprios:
  9. 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. 10. jQuery e o CSS.  Muito simples manipular CSS por jQuery. Ex.:
  11. 11. Efeitos em jQuery.  Métodos que possibilitam a criação de efeitos customizados.  Métodos com efeitos nativos.
  12. 12. Efeitos em jQuery.  animate() - Criar animações personalizadas. Ex.:
  13. 13. Efeitos em jQuery.  delay() - Seta um tempo de espera entre execuções. Ex.:  fadeIn(), fadeOut(), fadeToggle() – Aparecer e desaparecer. Ex.:
  14. 14. Efeitos em jQuery.  hide(), show(), toggle() Ex.:  slideDown(), slideUp(), slideToggle() Ex.:
  15. 15. Ajax com jQuery.  Muito, muito, mas muito mais simples mesmo que JavaScript puro.  Muito mais organizado que em JavaScript puro.
  16. 16. Ajax com jQuery.  load() – Lê dados servidor e os carrega no elemento HTML selecionado. Ex.:  ajax() – Realiza requisições ajax. Ex.:
  17. 17. Plugins do jQuery – O que são?  Códigos jQuery para ajudar o desenvolvedor a fazer algo (validar formulários, upload de arquivos..).  Vantagem de ter muita coisa boa já implementada.  Encurta o tempo de desenvolvimento.
  18. 18. Como usar um plugin?  Download dos arquivos do plugin (imagens, .js, .css, .swf...)  Chamar os arquivos necessários na página (.js, .css …)  Utilizar o plugin.
  19. 19. Bons plugins jQuery  Validate – Validar formulários  Fancybox – Lightbox genérico  jQuery UI – Interações com o usuário  MeioMask – Máscaras (CPF, Telefone ...)
  20. 20. Contatos  @tiagobutzke  tiago@stoodos.com

×