Quando falo em JQuery muitos clientes e amigos me perguntam: "Mais o que é o JQuery? Quais suas usabilidades?". Por esse motivo estarei explicando do que se trata um JQuery, quais suas usabilidades e também darei alguns exemplos bem legais!
Desvendando JQuery
Para que possamos entender o JQuery precisamos primeiro mencionar o JavaScript que nada mais é do que
Veja mais em -> http://pt.wikipedia.org/wiki/JavaScript
Jquery é uma ótima biblioteca para desenvolvimento de javascripts onde esses interagem com páginas html. Com ele pode-se definir efeitos de movimentações, criar ou alterar elementos nas páginas e até mesmo atribuir ou manipular eventos e muitas outras ações.
Uma das melhores coisas em JQuery são os diversos plugins open-source que ajudam e aceleram o processo de desenvolvimento de efeitos de transições e máscaras de validações para campos de formulários.
Desta forma, não existe a necessidade de criar uma nova máscara de validação para cada novo projeto, por exemplo, ou ter que perder horas fazendo efeitos de transições para banner's, pois encontraremos milhares de bons efeitos já testados e usados por muitos.
Utilizando JQuery
Para utilização de JQuery é necessário que você faça o download do arquivo em extensão .js , que pode ser encontrado como comprimido (versões menos) ou não comprimidas (versões completas). Abaixo coloco link para download da ultima versão completa até a data de postagem deste:
http://code.jquery.com/jquery-1.6.2.min.js - salve o arquivo como jquery.js
Escolhi trabalhar com a versão completa, pois a diferença de tamanho em KB é muito pequena
Para chamarmos o arquivo em nosso documento html basta introduzir o código abaixo entre as tags <head> </head>
<script type="text/javascript" language="javascript" src="javascript/jquery.js"></script>
Exemplos
Como existem muitos modelos desenvolvidos em jquery, vou dar um breve exemplo de utilização e também alguns outros que acho legal!
Dentro das tags <html> </html> iremos introduzir um botão instanciado com o id = botao" o qual utilizaremos para chama-lo e aplicar uma ação em nosso código:
<button id="botao">Clique aqui</button>
Logo abaixo introduza o código:
<script type="text/javascript"> $(document).ready(function(){ $("#botao").click(function() { alert('Aqui Vem seu Texto'); }); }); </script>
Sintaxe:
Na Terceira Linha estamos definindo um evento ao clicar no botão com ID #botao, mostrando uma caixa de alerta com o texto "Aqui Vem seu Texto". $() : utilizado em todas as funções que devem ser referenciadas a jQuery; document : expressão que indica o documento HTML; ready() : associado a leitura do documento enquanto está sendo carregado; function{} :
Masked Input Plugin
Coda Slider
jCarousel
Multiple File Upload
Espero que tenham gostado!
Ate breve!
