O jQuery, sem sombra de dúvidas, revolucionou a maneira como escrevemos Javascript. Baseado no atalho $ paradocument.getElementById, o jQuery estendeu-o muito além do que se podia imaginar, misturando-o com a funçãodocument.getElementsBySelector. Além do evidente aumento de produtividade, o tamanho da biblioteca impressiona: a versão 1.3.2 tem apenas 19kb para fazer tudo o que você precisa: requisições AJAX, iteração e criação de elementos DOM, tratamento de eventos… resumindo, é uma biblioteca completa, sem deixar a simplicidade de lado. Uma coisa que deve ficar muito clara...

Criaremos hoje uma galeria de imagens com descrição em efeito Fade do jQuery. Muito usado em portifólios, virou símbolo de modernidade fazer com que o site tenha efeitos de flash e com pouco trabalho. Vamos ao código: 1.HTML Primeiramente, html. Toda a descrição e/ou título precisa estar dentro da classe “caption”: <div class="item"> <a href="#"><img src="image.gif" alt="title" title="" width="125" height="125"/></a> <div class="caption"> <a href="">Titulo</a> <p>Descrição</p> </div> </div> 2.CSS O código...

Aqui está um efeito que venho procurando por algum tempo, e resolvi transformá-lo em tutorial. É um efeito interessante porque além de leve, deixa o site com uma cara mais moderna e dinâmica. Primeiro vamos conhecer o efeito: Perceba que as partículas (no caso 4 imagens) se mexem em diferentes pontos da tela, alterando velocidade e sentido, fazendo com que o site fique animado. Vamos ao que nos interessa: 1. HTML Criaremos uma div com id ‘container’ onde as partículas estarão circulando: var Spark = function() { var self = this; this.b = 'imagens/';//aqui você indica...

O efeito “aeroporto” é feito em jQuery pelo site http://www.unwrongest.com/projects/airport/. Um efeito muito bom para sites no ramo de aeronáutica. Vale a pena dar uma conferida! Link: http://www.unwrongest.com/projects/airport/ Demo: http://sandbox.unwrongest.com/jquery.airport/ Share/Save

Um das tendências do web design é o uso dinâmico de imagens, tais como um banner rotativo ou mesmo efeitos de slideshow. Raymond Selda publicou em seu web site como fazer um conteúdo rotatório com jQuery. Veja o exemplo funcionando. O slider funciona com textos e imagens, ou seja, pode-se colocar qualquer tipo de informações dentro de html ou dinamicamente com php. link: http://www.raymondselda.com/create-a-tabbed-content-rotator-using-jquery/ Share/Save

Aprenda como criar uma jQuery Bubble! Veja a Demonstração Share/Save

Hoje em dia é essencial um uso mais aprofundado de efeitos na web, substituindo o uso demasiado de flash’s e deixando cada vez mais rápido o carregamento do site. Um desses efeitos que chamam a atenção é os “sliders” em jQuery. Além de serem leves e de fácil uso, são muito úteis para paginas dinâmicas e que precisam exibir bastantes informações. O site AjaxLine, traz uma lista com 10 dos melhores slider para os desenvolvedores! Fonte: http://www.ajaxline.com/10-best-jquery-sliders Licença: Grátis Share/Save

Venho aqui postar um ótimo curso de jquery criado por Felipe Damaceno ,o criador do site Cursojá. Para quem não sabe JQuery é um framework para ajudar os desenvolvedores a se concentrarem na lógica dos sistemas da web e não nos problemas de incompatibilidade dos navegadores atuais. Seu lema é escrever menos e fazer mais. Estão disponíveis plugins adicionais que vão desde efeitos visuais na página da web até controle de dados via ajax.Uma função escrita em Javascript puro tem uma diminuição nótavel quando reescrita com este framework. Gostou? Então clique no link abaixo e...

WebKreation mostrou-nos como criar um “login em painel deslizante” usando Mootools. Recentemente, ele tem melhorado tanto o design e as funcionalidades do script e liberada uma nova versão desta vez.  O painel sobrepõe conteúdo ao invés de apertar o conteúdo para baixo. Embora o script é muito simples com o básico efeito jQuery “SlideUp” e “SlideDown”, o desenho do painel parece muito elegante e bonito. Você pode achar que é útil em alguns de seus projetos. Requerimentos: IE6, IE7, Firefox, Safari, Opera e Google Chrome Demo: http://web-kreation.com/demos/Sliding_login_panel_jquery/ Licença:...