Recommandé
Contenu connexe
Tendances
Tendances (20)
En vedette
En vedette (20)
Similaire à JQuery - JS 101
Similaire à JQuery - JS 101 (17)
JQuery - JS 101
- 1. jQuery $$ @ JS101
- 2. Procurem no Google: “jQuery”
- 3. Coloquem entre <head> e </head>: <script src="jquery-1.6.x.min.js"></script> versão atual
- 4. CTRL SHIFT I
- 5. jQuery()
- 6. $()
- 7. $('p')
- 8. $('p') Selecione todos os elementos <p> da página
- 10. $('#favorito') Selecione o elemento da página com o id="favorito"
- 11. $('.especial')
- 12. $('.especial') Selecione todos os elementos da página com class="especial"
- 14. $('ul .especial') Selecione todos os elementos da página com class="especial"... ...que estiverem dentro de um elemento <ul>
- 15. CSS Selectors
- 16. var x = $('h2') x.hide()
- 17. x.show()
- 18. x.slideUp()
- 19. x.slideDown()
- 20. x.slideUp(5000)
- 22. x.slideDown(5000, function(){ console.log('fim') }) é chamada quando a função acaba
- 25. x.animate({ fontSize: '150px' }) objeto com propriedades CSS a serem animadas
- 26. x.animate(estilo, tempo, func) opcionais
- 27. $(function(){ // quando a página carregar })
- 28. $(function(){ ! $('#secao1, #secao2').hide() ! $('#btn1').click(function(){ ! ! console.log('Clicou no botão 1') ! }) ! $('#btn2').click(function(){ ! ! console.log('Clicou no botão 2')! ! }) })
- 29. $(function(){ ! $('#secao1, #secao2').hide() ! $('#btn1').click(function(){ ! ! console.log('Clicou no botão 1') ! }) ! $('#btn2').click(function(){ ! ! console.log('Clicou no botão 2')! ! }) })
- 30. $(function(){ ! $('#secao1, #secao2').hide() ! ! ! $('#btn1').click(function (){ ! ! $('#secao1').slideDown() ! ! $('#secao2').slideUp() ! }) ! $('#btn2').click(function (){ ! ! $('#secao1').slideUp() ! ! $('#secao2').slideDown()! ! ! ! }) })
- 31. :)