Javascript é realmente uma linguagem de programação muito poderosa. Não falo isso só por ser apaixonado pela linguagem, mas sim por diariamente programar Javascript e ver o seu poder.
Frameworks ajudam claro, mas não se esqueçam que no fundo é tudo o mais puro e belo Javascript.
Na lista do Jquery que participo, seguido vejo algumas pessoas equivocadamente confundindo um pouco isso, mas isso fica pra um próximo Post.
O que vou abordar neste Post é um plugin muito bom desenvolvido pelo Brandon Aaron.
Pra quem não conhece, esse cara mora lá pelas bandas do Texas e é um dos principais membros do time de desenvolvedores do Jquery.
A idéia básica do plugin é criar um efeito de Gradient(vai de uma cor para outra) em um elemento HTML. Isso mesmo! Nada de Photoshop. \O/
O que precisamos: obviamente o Jquery, e o plugin Gradient.
Mas dessa vez vou um pouco mais além…
O plugin nos permite especificar o código RGB inicial, o o código RGB final e ainda a direção do Gradient(vertical ou horizontal).
Vamos ver o código pra entender melhor:
$('#meu_elemento').gradient({
from: 'ffffff',
to: '000000',
direction: 'vertical';
});
Neste exemplo o efeito Gradient será aplicado no elemento com o ID meu_elemento, começando de branco e indo até preto com direção vertical.
Simples !
Bom, mas como eu disse acima, vamos um pouco mais além. Se precisamos passar valores RGB para o plugin, então quem sabe podemos usar um outro plugin bem conhecido e muito bom também, o Color Picker.
Preparei um script onde uso as funcionalidades dos 2 plugins. Vejam abaixo como ficou. E novamente vejam o poder do Javascript:
Veja aqui o exemplo: http://jaydson.org/code/jquery/plugins/gradient/index.html
Espero que tenham gostado e que seja útil para alguma Aplicação de vocês.
Qualquer dúvida comentem ai.
Abraço, e até a próxima.
Minha Avaliação: Nota 8.0
Compatibilidade: Firefox 2.0+, IE 6+, Safari 3.0+, Chrome 2.0+
Site oficial do Plugin: http://brandonaaron.net/code
Related Posts:

The Gradient – Jquery Plugin by Jaydson Gomes, unless otherwise expressly stated, is licensed under a Creative Commons Attribution 2.5 Brazil License.


#1 by Ruan Carlos at 20 de maio de 2009
Cara, muito bom, mais está com um bug (pelo menos no ff) quando eu seleciono a cor ele não joga o valor para o textbox.
Só isso, parabéns.
#2 by Robson Almeida at 20 de maio de 2009
No Chrome acontece o mesmo quando seleciono a cor…
Mas ficou muito bom baguan keliê!
Parabéns!
#3 by jaydson at 23 de maio de 2009
Fla Ruan.
Pois é..notei este bug só depois do teu comentário. Valeu a dica.
Consertei já…pode dar uma conferida.
Abraço!
#4 by jaydson at 23 de maio de 2009
Ai Robson. Valeu!
Da uma testada agora que foi solucionado o bug.