O que é 
• Rica e extensiva biblioteca de componentes 
gráficos 
• “Biblioteca para a biblioteca Jquery” 
“Write less, do ...
Pra que serve 
• Criação de elementos de interface 
• Animar elementos HTML com facilidade 
• Mínimo de código
Como funciona 
Mecanismos da biblioteca identificam a marcação 
criada pelo autor e inserem elementos adicionais e 
atribu...
BREAK; 
//WTF IS DOM? 
Com participação especial do Suissa
DOM 
• Document Object Model (Modelo de Objeto de 
Documento) 
• Representação das linguagens de marcação 
• Possui atribu...
ARVORE DOM 
Foto tirada do site Tableless
Utilização
Utilização
Utilização
Elementos de 
Interface 
Classificados nos grupos Componentes, 
Widgets, Efeitos e Utilidades
Utilidades 
Alguns métodos para tarefas comuns no dia a dia.
Componentes 
É a interação do mouse com os elementos da página. 
(arrastar, soltar, dimensionar, selecionar e ordenar)
Widgets 
Interfaces de usuário prontas que permitem customização. 
(accordion, autocomplete, button, datepicker, dialog, p...
Efeitos 
Animações simples e funções baseadas na manipulação de 
classes.
Efeitos 
• Show/hide, Add/remove class 
• Color Animation: anima cores do elemento 
• Toggle Class: Alterna a presença de ...
Links Úteis 
• http://api.jqueryui.com/ - API jQuery UI 
• http://www.livrojqueryui.com.br/exemplos/index.ht 
ml - Exemplo...
Referências Bibliográficas 
• Tableless. (2014). Tenha o DOM. [Em linha]. Disponível em 
http://tableless.com.br/tenha-o-d...
Jquery ui
Próximos SlideShares
Carregando em…5
×

Jquery ui

371 visualizações

Publicada em

Construtalks realizado dia 29/11/2014 sobre a biblioteca jQuery UI.

Publicada em: Internet
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
371
No SlideShare
0
A partir de incorporações
0
Número de incorporações
6
Ações
Compartilhamentos
0
Downloads
2
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Jquery ui

  1. 1. O que é • Rica e extensiva biblioteca de componentes gráficos • “Biblioteca para a biblioteca Jquery” “Write less, do more” [jquery.com 2009]
  2. 2. Pra que serve • Criação de elementos de interface • Animar elementos HTML com facilidade • Mínimo de código
  3. 3. Como funciona Mecanismos da biblioteca identificam a marcação criada pelo autor e inserem elementos adicionais e atributos classes a criar condições para a estilização adequada à criação do elemento de interface. O princípio de funcionamento da biblioteca é a modificação do DOM.
  4. 4. BREAK; //WTF IS DOM? Com participação especial do Suissa
  5. 5. DOM • Document Object Model (Modelo de Objeto de Documento) • Representação das linguagens de marcação • Possui atributos e métodos • Permite navegar e manipular seus documentos através de uma linguagem de programação
  6. 6. ARVORE DOM Foto tirada do site Tableless
  7. 7. Utilização
  8. 8. Utilização
  9. 9. Utilização
  10. 10. Elementos de Interface Classificados nos grupos Componentes, Widgets, Efeitos e Utilidades
  11. 11. Utilidades Alguns métodos para tarefas comuns no dia a dia.
  12. 12. Componentes É a interação do mouse com os elementos da página. (arrastar, soltar, dimensionar, selecionar e ordenar)
  13. 13. Widgets Interfaces de usuário prontas que permitem customização. (accordion, autocomplete, button, datepicker, dialog, progressbar, slider, tabs)
  14. 14. Efeitos Animações simples e funções baseadas na manipulação de classes.
  15. 15. Efeitos • Show/hide, Add/remove class • Color Animation: anima cores do elemento • Toggle Class: Alterna a presença de determinada classse, animando as alterações de estilo • Switch class: Alterna entre duas classes, animando as alterações de estilo
  16. 16. Links Úteis • http://api.jqueryui.com/ - API jQuery UI • http://www.livrojqueryui.com.br/exemplos/index.ht ml - Exemplos do livro jQuery UI – Componentes de interface rica para suas aplicações web (2012, MAUJOR)
  17. 17. Referências Bibliográficas • Tableless. (2014). Tenha o DOM. [Em linha]. Disponível em http://tableless.com.br/tenha-o-dom/. [consultado em 29-10-2014]. • Desenvolvedor FrontEnd. (2013). Navegando no DOM - jQuery. [Em linha]. Disponível em http://wbruno.com.br/jquery/navegando-no-dom-jquery/. [consultado em 29-10-2014]. • DEVMEDIA. (2013). Explorando o jQuery UI. [Em linha]. Disponível em http://www.devmedia.com.br/explorando-o-jquery-ui/30316#ixzz3HRumftBf/. [consultado em 29-10-2014]. • MAUJOR, Maurício. jQuery UI – Componentes de interface rica para suas aplicações web [Em linha]. 1ª edição (2012), p. 31-40. [consultado em 29-10- 2014]. Disponível na internet: http://www.novatec.com.br/livros/jquery-ui/ capitulo9788575222966.pdf/.

×