Merge remote-tracking branch 'adambard/master'

1 files changed, 131 insertions, 0 deletions

diff --git a/pt-br/jquery-pt.html.markdown b/pt-br/jquery-pt.html.markdown
new file mode 100644
index 00000000..d49bea0f
--- /dev/null
+++ b/pt-br/jquery-pt.html.markdown
@@ -0,0 +1,131 @@
+---
+category: tool
+tool: jquery
+contributors:
+    - ["Sawyer Charles", "https://github.com/xssc"]
+translators:
+    - ["Nikolas Silva", "https://github.com/nikolassilva"]
+filename: jquery-pt.js
+lang: pt-br
+---
+
+jQuery é uma biblioteca JavaScript que te ajuda a "fazer mais, escrevendo menos". Ela faz com que muitas tarefas comuns em JavaScript sejam mais simples de escrever. jQuery é usado por grandes empresas e desenvolvedores do mundo todo. Ela torna o AJAX, manipulação de eventos, manipulação do DOM, entre outros, mais fácil e rápido.
+
+Pelo jQuery ser uma biblioteca JavaScript você deve [aprende-lo primeiro](https://learnxinyminutes.com/docs/pt-br/javascript-pt/)
+
+```js
+
+
+///////////////////////////////////
+// 1. Seletores
+
+// Seletores no jQuery são usados para selecionar um elemento
+var page = $(window); // Seleciona toda a viewport
+
+// Seletores também podem ser na forma do CSS
+var paragraph = $('p'); // Seleciona todos elementos de parágrafo
+var table1 = $('#table1'); // Seleciona o elemento com id 'table1'
+var squares = $('.square'); // Seleciona todos elementos com classe 'square'
+var square_p = $('p.square') // Seleciona todos elementos de parágrafo com a classe 'square'
+
+
+///////////////////////////////////
+// 2. Eventos e Efeitos
+// jQuery é muito bom em manipular o que acontece quando um evento é disparado
+// Um evento muito usado é o 'ready'  
+// Você pode usar o método ready para esperar até que um elemento tenha terminado de carregar
+$(document).ready(function(){
+  // O código não será executado até que o documento carregue
+});
+// Você também pode usar funções declaradas
+function onAction() {
+  // Isso será executado quando um evento for disparado
+}
+$('#btn').click(onAction); // Chama 'onAction' quando o elemento receber um clique
+
+// Outros eventos comuns são:
+$('#btn').dblclick(onAction); // Clique duplo
+$('#btn').hover(onAction); // Mouse sobre elemento
+$('#btn').focus(onAction); // Elemento recebe foco
+$('#btn').blur(onAction); // Elemento perde foco
+$('#btn').submit(onAction); // Envio de formulário
+$('#btn').select(onAction); // Quando o elemento é selecionado
+$('#btn').keydown(onAction); // Quando uma tecla é segurada
+$('#btn').keyup(onAction); // Quando uma tecla é solta
+$('#btn').keypress(onAction); // Quando uma tecla é pressionada
+$('#btn').mousemove(onAction); // Quando o mouse é movido
+$('#btn').mouseenter(onAction); // Quando o mouse entra no elemento
+$('#btn').mouseleave(onAction); // Quando o mouse sai do elemento
+
+
+// Eles também podem disparar os eventos em vez de manipulá-los,
+// simplesmente deixando de passar os parâmetros
+$('#btn').dblclick(); // Dispara um clique duplo no elemento
+
+// Você pode manipular múltiplos eventos usando o seletor apenas uma vez
+$('#btn').on(
+  {dblclick: myFunction1} // Disparado num clique duplo
+  {blur: myFunction1} // Disparado quando perder o foco
+);
+
+// Você pode mover e esconder elementos com alguns métodos de efeito
+$('.table').hide(); // Esconde o elemento
+
+// Nota: chamar uma função nesse método ainda irá esconder o elemento
+$('.table').hide(function(){
+    // Elemento é escondido e a função é executada
+});
+
+// Você pode guardar seletores em variáveis
+var tables = $('.table');
+
+// Alguns métodos básicos de manipulação do DOM:
+tables.hide(); // Esconde elemento(s)
+tables.show(); // Exibe elemento(s)
+tables.toggle(); // Alterna entre esconder/exibir
+tables.fadeOut(); // Efeito fade out
+tables.fadeIn(); // Efeito fade in
+tables.fadeToggle(); // Alterna entre fade out/in
+tables.fadeTo(0.5); // Efeito fade com opacidade específica (entre 0 e 1)
+tables.slideUp(); // Efeito de deslize pra cima
+tables.slideDown(); // Efeito de deslize pra baixo
+tables.slideToggle(); // Alterna entre deslizar pra cima/baixo
+
+// Todos os métodos acima levam velocidade (em milissegundos) e uma função callback
+tables.hide(1000, myFunction); // Esconde o elemento em 1 segundo e chama a função
+
+// No fadeTo é obrigatório definir a opacidade como segundo parâmetro
+tables.fadeTo(2000, 0.1, myFunction); // 2 segundos de fade para 0.1 de opacidade e chama a função
+
+// Você pode fazer animações mais avançadas com o método animate
+tables.animate({'margin-top':"+=50", height: "100px"}, 500, myFunction);
+// O método animate leva um objeto com valores CSS,
+// um parâmetro de opções para melhorar a animação
+// e uma função callback, como de costume
+
+///////////////////////////////////
+// 3. Manipulação
+
+// São similares aos efeitos, mas podem fazer mais
+$('div').addClass('taming-slim-20'); // Adiciona a classe taming-slim-20 em todas as divs
+
+// Métodos comuns de manipulação
+$('p').append('Hello world'); // Adiciona ao final do elemento
+$('p').attr('class'); // Obtém o valor de um atributo
+$('p').attr('class', 'content'); // Define o valor de um atributo
+$('p').hasClass('taming-slim-20'); // Retorna true se tiver a classe
+$('p').height(); // Obtém/define a altura do elemento
+
+
+// Pra maioria dos métodos de manipulação, pegar o valor de um 
+// elemento só afetará o primeiro deles
+$('p').height(); // Obtém a altura da primeira tag 'p'
+
+// Você pode usar o método each pra percorrer os elementos
+var heights = [];
+$('p').each(function() {
+  heights.push($(this).height()); // Adiciona a altura das tags 'p' na array
+});
+
+
+```