Pgina 1 Apostila jQuery

Apostila jQuery

Contedo
1. 2. 3. 4. 5. 6. 7. 8.
Configurao Ol jQuery Me encontre: sando seletores e e!entos Me a!alie: sando A"A# Me ani$e: sando %feitos Me ordene: sando o plugin ta&lesorter 'ordenador de ta&ela( Me plugue: %scre!endo seus pr)prios plugins Pr)*i$os passos

Por onde co$ear co$ a jQuery+

Este guia uma introduo biblioteca jQuery. Ter um conhecimento sobre javascript e modelo de objeto de documento (,OM) so requisitos necessrios. Ele comea do bsico e tenta e plicar os detalhes quando necessrio. Ele abordar um e emplo simples al! mundo" seletores e eventos bsicos" A"A#" e#eitos e o desenvolvimento de plugins. Este guia no contm e emplos $prontos para clicar$. % inteno de prover apenas os $c&digos para copiar$ um convite para que voc' mesmo #aa os testes. (opie um e emplo" veja o que ele #a)" e modi#ique*o.

Pgina - Apostila jQuery

Configurao
+ara comear" n&s precisamos de uma c&pia da biblioteca j,uer-. %inda que a verso mais recente possa ser encontrada neste lin./ .ttp://docs0j1uery0co$/,o2nloading3jQuery" este guia #ornece um pacote bsico que voc' poder bai ar. 0it para comear com o j,uer-/ 1aa o do2nload deste arquivo e e traia o seu conte3do. %bra o starter.it.html e o custom.js com o seu editor pre#erido e o starterkit.html com o navegador. 4Caso j ten.a este ar1ui!o e$ seu co$putador no . necessidade de &ai*5lo0 %gora n&s temos tudo o que precisamos para iniciar o not&rio e emplo do 6Al7 $undo60 8in9s interessantes para este cap:tulo:

0it para comear 4o2nloads do j,uer-

Ol jQuery
(omo quase tudo o que #a)emos quando estamos utili)ando o jQuery l' ou manipula um modelo de objeto de documento (456)" precisamos nos certi#icar que comeamos adicionado eventos etc to logo o 456 esteja pronto. +ara #a)er isso" n&s registramos o evento ready (pronto) para o documento. 7(document).read-(#unction() 8 99 #aa alguma coisa quando o 456 estiver pronto :); (olocar um alert nesta #uno no #a) muito sentido" pois o alert no requer que o 456 esteja carregado. Ento vamos tentar algo mais so#isticado/ 6ostrar um alert quando clicarmos o lin.. 7(document).read-(#unction() 8 7($a$).clic.(#unction() 8 alert($5l mundo<$); :); :); 4essa #orma o alert ser e ibido assim que voc' clicar no lin.. =amos dar uma olhada no que estamos #a)endo/ 7($a$) um seletor do j,uer-" neste caso" ele seleciona todos os elementos a. 5 7 por si s& um alias para a $classe$ j,uer-" por outro lado o 7() constr&i um novo objeto j,uer-. % #uno clic.() que chamamos depois um mtodo do objeto j,uer-. Ele liga o evento clique a todos os elementos selecionados (neste caso" um 3nico elemento a) e e ecuta a #uno #ornecida quando o evento ocorre. >sto similar ao seguinte c&digo/ <a href="#" onclick="alert('Ol mundo')"> ink<!a>

Pgina ; Apostila jQuery

% di#erena bem &bvia/ ?&s no precisamos escrever onclic. para todo elemento. ?&s temos uma separao clara de estrutura (@T6A) e comportamento (BC)" assim como separamos estrutura e #ormatao utili)ando (CC. (om isso em mente" e ploramos seletores e eventos um pouco mais a #undo. 8in9s interessantes para este cap:tulo:

Dase do j,uerE pressEes do j,uerEventos Dsicos do j,uer-

Me encontre:

sando seletores e e!entos

5 j,uer- prov' duas maneiras de selecionar elementos. % primeira utili)a uma combinao de seletores (CC e F+ath passados como uma string para o construtor do j,uer- (e . 7($div G ul a$)). % segunda utili)a vrios mtodos do objeto j,uer-. %mbas podem ser combinadas. +ara testar alguns desses seletores" vamos selecionar e modi#icar a primeira lista ordenada no nosso .it para comear. +rimeiramente queremos selecionar a pr&pria lista. % lista tem um >4 $lista5rdenada$. ?o javascript clssico" voc' pode selecion*la usando document.getElementD->d($lista5rdenada$). (om o j,uer-" n&s #a)emos isso assim/ 7(document).read-(#unction() 8 7 ($Hlista5rdenada$).add(lass($vermelho$); :); 5 .it para comear #ornece uma #olha de estilos com a classe $vermelho$ que simplesmente adiciona um #undo vermelho. ?o entanto" quando voc' recarrega a pgina no seu navegador" voc' ver que a primeira lista tem o #undo vermelho. % segunda lista permanece inalterada. %gora vamos adicionar mais classes para os elementos #ilhos desta lista. 7(document).read-(#unction() 8 7($Hlista5rdenada G li$).add(lass($a)ul$); :); >sto seleciona todos os lis #ilhos do elemento com id lista5rdenada e adiciona a classe $a)ul$. %gora alguma coisa mais so#isticada/ ?&s queremos adicionar e remover a classe quando o usurio passar o mouse sobre o elemento li" mas somente no 3ltimo elemento da lista. 7(document).read-(#unction() 8 7($Hlista5rdenada li/last$).hover(#unction() 8 7(this).add(lass($verde$); :" #unction() 8 7 (this).remove(lass($verde$); :); :);

Pgina < Apostila jQuery E istem diversos outros seletores similires sinta e (CC e F+ath. 6ais e emplos e a lista de todas as e pressEes disponIveis podem ser encontrados neste lin./ http/99docs.jquer-.com94569Traversing9Celectors. +ara todo evento onxxx disponIvel" como onclic." onchange" onsubmit" e istem um equivalente no j,uer-. %lguns outros eventos" como read- e hover" so mtodos convenientes para algumas tare#as. =oc' pode encontrar uma lista completa com todos os eventos suportados no http/99222.visualjquer-.com na seo de Events.

(om estes seletores e eventos voc' j pode #a)er muita coisa" mas tem muito mais. 7(document).read-(#unction() 8 7 ($Hlista5rdenada$).#ind($li$).each(#uncti on(i) 8 7(this).html( 7(this).html() J $ D%6< $ J i ); :); :); 5 #ind() permite que voc' #aa uma pesquisa mais a #undo nos descendentes dos elementos j selecionados" apesar de 7($Hlista5rdenada).#ind($li$) ser praticamente o mesmo que 7 ($Hlista5rdenada li$). 5 each() #a) a iterao sobre cada elemento e permite um processamento mais pro#undo. % maioria dos mtodos" como o add(lass()" utili)a o each() internamente. ?este e emplo" o html() utili)ado para recuperar o te to de cada elemento li" adicionar algum te to a ele e de#inI*lo como o te to do elemento. Kma outra tare#a que voc' #requentemente ter que lidar chamar mtodos em elementos 456 que no so suportados pelo j,uer-. +ense em um #ormulrio que voc' gostaria de resetar depois que enviou com sucesso via %B%F. 7(document).read-(#unction() 8 99 use isto para resetar um 3nico #ormulrio 7($Hreset$).clic.(#unction() 8 7($H#orm$)LMN.reset(); :); :); Este c&digo seleciona o elemento com o >4 $#orm$ e chama o reset() no primeiro elemento selecionado. (aso e ista mais de um #orm" voc' pode #a)er dessa maneira/ 7(document).read-(#unction() 8 99 use isto para resetar todos os #ormulrios de uma s& ve) 7($Hreset$).clic.(#unction() 8 7($#orm$).each(#unction() 8 this.reset(); :); :); :); >sto deve selecionar todos os #ormulrios no seu documento" #a)er a iterao sobre eles e chamar o reset() para cada um.

Pgina = Apostila jQuery 5utro problema que voc' pode encontrar no selecionar alguns elementos. 5 j,uer- prov' o #ilter() e o not() para isto. Enquanto o #ilter() redu) a seleo para os elementos que atendem e presso de #iltro" o not() #a) e atamente o contrrio" removendo todos os elementos que atendem a e presso. >magine uma lista desordenada onde voc' quer selecionar todos os elementos li que no possuam um #ilho ul. 7(document).read-(#unction() 8 7($li$).not($LulN$).css($border$" $Op solid blac.$); :); >sto seleciona todos os elementos li e remove todos os elementos da seleo que possuam um elemento ul como #ilho. Cendo assim todos os elementos li #icaro com uma borda" com e ceo daqueles que possuam um #ilho ul. % sinta e Le pressoN vinda do F+ath e pode ser utili)ada para #iltrar elementos e atributos #ilhos. Talve) voc' queira selecionar todas as Pncoras que possuam o attributo name/ 7(document).read-(#unction() 8 7 ($aLQnameN$).bac.ground($Heee$); :); >sto adiciona uma cor de #undo para todos os elementos Pncora com o atributo name. 6ais comum que selecionar as Pncoras pelo nome" voc' pode precisar selecionar as Pncoras pelo atributo $hre#$. >sto pode ser um problema uma ve) que os navegadores se comportam inconsistentemente quando retornam o que eles pensam que o valor do $hre#$ . +ara selecionar apenas uma parte do value" podemos utili)ar o seletor contm $RS$ ao invs do igual ($S$)/ 7(document).read-(#unction() 8 7($aLQhre#RS9content9galler-N$).clic.(#unction() 8 99 #aa alguma coisa com todos os lin.s que apontam para algum lugar em 9content9galler:); :); %t agora" usamos todos os seletores para selecionar os #ilhos ou #iltrar a seleo atual. E istem situaEes onde voc' ir precisar selecionar os anteriores ou pr& imos elementos" conhecidos como siblings (#ilhos do mesmo pai). +ense em uma pgina de um 1%," onde todas as respostas esto escondidas em um primeiro momento e so e ibidas quando a questo clicada. 5 c&digo do j,uer- para isso/ 7(document).read-(#unction() 8 7 (TH#aqT).#ind(TddT).hide().end().#ind(TdtT).clic.(#unction () 8 var resposta S 7(this).ne t(); i# (resposta.is(T/visibleT)) 8 resposta.slideKp(); : else 8 resposta.slide4o2n(); : :); :); %qui estamos usando um pouco de encadeamento para redu)ir o tamanho do c&digo e ganhar per#ormance" uma ve) que TH#aqT selecionada apenas uma 3nica ve). Ksando o end()" o

Pgina > Apostila jQuery primeiro #ind() des#eito" assim podemos comear a procurar com o pr& imo #ind() no nosso elemento H#aq" ao invs de procurar no #ilho dd. (om o acionamento do evento clic." a #uno passada ao mtodo clic.()" utili)amos 7(this).ne t() para encontrar o pr& imo sibling a partir do dt atual. >sto nos permite selecionar rapidamente a resposta seguinte questo clicada. %lm dos siblings" voc' tambm pode selecionar os elementos pais (tambm conhecidos como ancestrais para os mais #amiliari)ados com o F+ath). Talve) voc' pode querer realar o pargra#o que o pai do lin. que o usurio passar o mouse. Tente isso/ 7(document).read-(#unction() 8 7($a$).hover(#unction() 8 7 (this).parents($p$).add(lass($realcar$); :" #unction() 8 7 (this).parents($p$).remove(lass($realca r$); :); :); +ara todos os elementos Pncoras que o usurio passar o mouse" o pargra#o pai procurado e a classe $realcar$ adicionada e removida. =amos voltar um passo atrs de continuarmos/ o j,uer- #a) com que o c&digo #ique menor e tornando*o mais #cil de ler e dar manuteno. 5 c&digo seguinte um atalho para a notao 7 (document).read-(callbac.)/ 7(#unction() 8 99 c&digo a ser e ecutado quando 456 est pronto :); %plicado ao e emplo do %l! 6undo<" #icaria assim/ 7(#unction() 8 7($a$).clic.(#unction() 8 alert($%l! 6undo<$); :); :); %gora com o bsico em mos" queremos e plorar outros aspectos" comeando com o %B%F. 8in9s interessantes para este cap:tulo:

4ocumentao da %+> do j,uer=isual j,uer- * Kma documentao categori)ada e navegvel da %+> do j,uerE pressEes do j,uer-/ (CC E pressEes do j,uer-/ F+ath E pressEes do j,uer-/ (ustomi)adas Eventos especiais no j,uerj,uer- 456 Traversing

Me a!alie:

sando A"A#

Pgina ? Apostila jQuery ?esta parte n&s escreveremos uma pequena aplicao %B%F que permite que o usurio avalie alguma coisa" assim como #eito no -outube.com. +recisamos de um pouco de c&digo do servidor para isso. 6eu e emplo utili)a um arquivo php que l' o parPmetro $avaliacao$ e retorna o n3mero de avaliaEes e a mdia de avaliao. 4' uma olhada no rate.php para o c&digo server*side. ?&s no queremos que este e emplo #uncione sem %B%F" mesmo que isto seja possIvel" ento n&s geramos a marcao necessria com o j,uer- e a adicionamos div com o >4 $avaliacao$. 7(document).read-(#unction() 8 99 gera a marcao var rating6ar.up S L$+or #avor avalie/ $N; #or(var iSO; i US V; iJJ) 8 rating6ar.upLrating6ar.up.lengthN S $Ua hre#STHTG$ J i J $U9aG $; : 99 adiciona a marcao ao container e aplica o acionador de clic. s Pncoras 7 ($Havaliacao$).append( rating6ar.up.join(TT) ).container.#ind($a$).clic.(#un ction(e) 8 e.prevent4e#ault(); 99 envia a requisio 7.post($rate.php$" 8avaliacao/ 7(this).html():" #unction( ml) 8 99 #ormata o resultado var resultado S L $5brigado por avaliar" mdia atual/ $" 7($media$" ml).te t()" $" n3mero de votos/ $" 7($contador$" ml).te t() N; 99 saIda do resultado 7($Havaliacao$).html(resultado.join(TT)); : ); :); :); Este pedao de c&digo gera cinco elementos Pncoras adicionando*os ao elemento container com o id $avaliacao$. 4epois disso" para cada Pncora no container" um observador do clic. adicionado. ,uando a Pncora clicada" uma requisio post enviada para o rate.php com o conte3do da Pncora como parPmetro. 5 resultado retornado como um F6A ento adicionado ao container" substituindo as Pncoras. Ce voc' no possui um servidor 2eb com o +@+ instalado em mos" voc' pode dar uma olhada no e emplo on*line. +ara ver um e emplo muito bom de um sistema de avaliao que #unciona at mesmo sem javascript" visite so#tonic.de e clique em $0ur) be2erten<$ 6ais documentao sobre os mtodos %B%F do j,uer- pode ser encontrada aqui ou no =isual j,uer- na categoria %B%F. Km problema muito comum encontrado quando se carrega um conte3do por %B%F o seguinte/ ,uando se adiciona controladores de evento ao seu documento que deveriam ser aplicados tambm ao conte3do carregado" voc' deve aplicar estes controladores depois que o conte3do carregado. +ara prevenir a c&digo duplicado" voc' pode delegar a uma #uno. E emplo/

Pgina @ Apostila jQuery 99 =amos usar o atalho 7(#unction() 8 var add(lic.@andlers S #unction() 8 7 ($a.clique+ara(arregar(onteudo$).clic.(#unction() 8 7($Htarget$).load(this.hre#" add(lic.@andlers); :); :; add(lic.@andlers(); :); %gora a #uno add(lic.@andlers aplicada uma ve) quando o 456 est pronto e depois toda ve) que o usurio clicar um lin. com a classe clique+ara(arregar(onteudo e o conte3do tiver terminado de ser carregado. +or #avor observe que a #uno $add(lic.@andlers$ de#inida como uma varivel local" ao invs de uma #uno global (como #unction add(lic.@andlers() 8...:). +rocure seguir esta prtica para prevenir con#lito com outras variveis ou #unEes globais. (om %B%F podemos e plorar muita coisa $Web X.M$. 6as at agora estamos devendo e#eitos bacanas. 8in9s interessantes para este cap:tulo:

6&dulo %B%F do j,uer%+> do j,uer-/ (ontm descrio e e emplos para adicionar e todos os outros mtodos do j,uerThic.Do / Km plugin para o j,uer- que o utili)a para aprimorar o #amoso lightbo

Me ani$e:

sando %feitos

%nimaEes simples com o j,uer- podem ser #eitas com o sho2() e o hide() 7(document).read-(#unction() 8 7($a$).toggle(#unction() 8 7 ($.algumacoisa$).hide(Tslo2T); :" #unction() 8 7 ($.algumacoisa$).sho2(T#astT); :); :); =oc' pode criar qualquer combinao das animaEes com o animate() como por e emplo um slide com #ade/ 7(document).read-(#unction() 8 7($a$).toggle(#unction() 8 7 ($.algumacoisa$).animate(8 height/ ThideT" opacit-/ ThideT :" Tslo2T); :" #unction() 8

Pgina A Apostila jQuery 7 ($.algumacoisa$).animate(8 height/ Tsho2T" opacit-/ Tsho2T :" Tslo2T); :); :); E#eitos muito mais so#isticados podem ser #eitos com a coleo de plugins >nter#ace (http/99inter#ace.e-econ.ro9). ?o site voc' encontrar demonstraEes e a documentao. %lm da coleo >nter#ace" que est no topo da lista de plugins do j,uer-" e istem muitos outros. 5 pr& imo capItulo lhe mostrar como usar o plugin tablesorter. 8in9s interessantes para este cap:tulo:

6&dulo de e#eitos do j,uer+lugin >nter#ace

Me ordene:

sando o plugin ta&lesorter

5 plugin tablesorter permite que voc' ordene as tabelas no lado do cliente. =oc' inclui o j,uere o pluguin e in#orma ao pluguin quais tabelas deseja ordernar. +ara e perimentar este e emplo" adicione esta linha ao starter.it.html (abai o da incluso do jquer-)/ <script src="li"!j#uery.ta"lesorter.js" type="te$t!ja%ascript"><!script> 4epois de incluir o plugin" voc' poder cham*lo assim/ 7 (document).read-(#unction() 8 7 ($Hlarge$).tableCorter(); :); Tente clicar nos cabealhos da tabela e veja se ela #ica ordenada em ordem ascendente no primeiro clique e descendente no segundo. % tabela deve utili)ar algum realce nas linhas" podemos adicion*los passando algumas opEes/ 7(document).read-(#unction() 8 7($Hlarge$).tableCorter(8 stripingYo2(lass/ LToddT"TevenTN" das linhas como um arra-. stripYo2s5nCtartKp/ true :); :);

99 ?ome da classe a ser utili)ada para a diviso 99 4ivide as linhas quando o tableCorter iniciar.

Pgina 1B Apostila jQuery E istem mais e emplos e documentao sobre as opEes disponIveis no site do tablesorter (222.motherrussia.pol-ester.se9jquer-*plugins9tablesorter9). % maioria dos plugins pode ser utili)ada como este/ >nclua o arquivo do plugin e chame o mtodo do plugin em alguns elementos" passando os parPmetros opcionais para customi)ar o plugin. Kma lista atuali)ada dos plugins disponIveis pode ser encontrada no site do j,uer(222.jquer-.com9plugins). ,uando voc' utili)ar o j,uer- com mais #reqZ'ncia" voc' perceber que ser melhor empacotar o seu pr&prio c&digo como um plugin" seja para o reuso para voc' mesmo ou para a sua empresa" ou para compartilh*lo com a comunidade. 5 pr& imo capItulo d algumas dicas sobre como estruturar um plugin. 8in9s interessantes para este cap:tulo:

+lugins para o j,uerTablesorter +lugin

Plugue5$e: %scre!endo seus pr)prios plugins

Escrever seus pr&prios plugins para o j,uer- muito #cil. Ce voc' seguir as regras abai o" ser #cil para outros integrarem o seu plugin tambm. 1. 2. ". &. +. Encontre um nome para o seu plugin, vamos chamar o nosso exemplo "foobar". Crie um arquivo chamado jquery. nomedoseuplugin!.js, ex. jquery.foobar.js Crie um ou mais m#todos no plugin extendendo o objeto j$uery, ex.% j$uery.fn.foobar ' function() * ,, fa-a alguma coisa ./

0. 1pcional% Crie um objeto com fun-2es de ajuda, ex.% 3. j$uery.foo4ar ' * 5. height% +, 6. calculate4ar ' function() * ... ., 17. chec89ependencies ' function() * ... . }; :oc; poder< ent=o chamar essa fun-=o de ajuda pelo seu plugin% j$uery.fn.foobar ' function() * ,, fa-a alguma coisa j$uery.foobar.chec89ependencies(value)/ ,, fa-a alguma outra coisa ./

Pgina 11 Apostila jQuery 11.1pcional% Crie configura-2es padr2es que possam ser alteradas pelo usu<rio, ex.% 12.j$uery.fn.foobar ' function(options) * 13. var settings ' * 1&. value% +, 1+. name% "pete", 10. bar% 0++ 13. ./ 15. if(options) * 16. j$uery.extend(settings, options)/ 27. . ./ =oc' pode ento chamar o plugin sem opEes" usando as con#iguraEes padrEes/ &("...").foo"ar()' 5u com algumas opEes/ 7 ($...$).#oobar(8 value/ OX[" bar/ \ :); Ce voc' lanar o seu plugin" voc' dever prover alguns e emplos e uma documentao. E istem diversos plugins disponIveis como &timas re#er'ncias. %gora voc' j deve ter uma idia bsica de como escrever um plugin. =amos utili)ar este conhecimento e escrever nosso pr&prio plugin. Kma coisa que muita gente" tentando manipular #ormulrios com o j,uer-" pede" marcar e desmarcar radio buttons ou chec.bo es. Eles acabam com um c&digo como este/ 7 ($inputLQt-peSTchec.bo TN$).each(#u nction() 8 this.chec.ed S true; 99 ou" para desmarcar this.chec.ed S #alse; 99 ou" para inverter this.chec.ed S < this.chec.ed; :); Cempre que voc' possuir um each no seu c&digo" voc' pode querer reescrever isto com um plugin" quase sem alteraEes/ 7.#n.chec. S #unction() 8 return this.each(#unction() 8 this.chec.ed S true; :); :; Este plugin agora pode ser utili)ado/

Pgina 1- Apostila jQuery &("input()type='check"o$'*").check()' %gova voc' pode escrever plugins para as duas #unEes unchec.() e toggle(hec.() tambm. 6as ao contrrio n&s estendemos nosso plugin para aceitar algumas opEes. 7.#n.chec. S #unction(modo) 8 var modo S modo ]] TonT; 99 se modo no est de#inido" use TonT como padro return this.each(#unction() 8 s2itch(modo) 8 case TonT/ this.chec.ed S true; brea.; case To##T/ this.chec.ed S #alse; brea.; case TtoggleT/ this.chec.ed S <this.chec.ed; brea.; : :); :; 4e#inindo um valor padro para as opEes" permite que o usurio omita a opo ou passe $on$" $o##$" e $toggle$" e ./ &("input()type='check"o$'*").check()' &("input()type='check"o$'*").check('on')' &("input()type='check"o$'*").check('off')' &("input()type='check"o$'*").check('to++le')' (om mais de uma con#igurao opcional" este mtodo torna*se complicado" pois o usurio dever passar valores nulos se quiser omitir o primeiro parPmetro e usar somente o segundo. 5 uso do tablesorter no 3ltimo capItulo demonstra o uso de um objeto literal tambm resolve este problema. 5 usurio omite todos os parPmetros ou passa um objeto com um par chave9valor para cada con#igurao que deseja sobrescrever. (omo um e ercIcio" voc' poderia tentar reescrever o c&digo do quarto capItulo como um plugin. 5 esqueleto do plugin deve ser similar a isto/ 7.#n.rate6e S #unction(options) 8 var container S this; 99 ao invs de selecionar um container esttico com 7 ($Hrating$)" n&s agora utili)amos o conte to do j,uervar settings S 8 url/ $rate.php$ 99 coloque mais padrEes aqui 99 lembre*se de colocar uma vIrgula ($"$) depois de cada par" mas no depois do 3ltimo< :; i#(options) 8 99 veri#ica se as opEes esto presentes antes de estender as con#iguraEes 7.e tend(settings" options); : 99 ...

Pgina 1; Apostila jQuery 99 resto do c&digo 99 ... return this; 99 se possIvel" retorne $this$ para no quebrar a corrente :);

Pr)*i$os passos
Ce voc' tem interesse em desenvolver mais em javascript" voc' deve dar uma olhada numa e tenso do 1ire#o chamada 1ireDug. Ela prov' um console (&timo para substituir os alerts)" um debugger e outras coisas 3teis para o seu desenvolvimento dirio em javascript. Ce voc' tem problemas que no consegue resolver" idias que gostaria de compartilhar ou apenas necessidade de e pressar sua opinio sobre o j,uer-" sinta*se vontade para postar na lista de discusso do j,uer- (222.jquer-.com9discuss).