Como fazer com que texto apareça apenas ao se clicar em um texto/botão

[Marcos Knijnik 0]

A pergunta é muito simples... sei que envolve HTML e CSS, mas não sei o que fazer...rs

 

O que eu quero é que em uma página simples tenha algo do tipo "ver mais detalhes", e ao se clicar em tal frase, abaixo surja os ditos detalhes...

 

Agradeço antecipadamente para todos que responderem a essa pergunta.

[Guilherme Müller 0]

Olá Marcos,

 

Para tal funcionalidade deve-se utilizar javascript, acho que não tem uma maneira de fazer apenas com HTML e CSS. Uma das maneiras de fazer é "esconder" a parte de mais detalhes utilizando CSS ou javascript e quando a pessoa clica no link "ver mais detalhes", uma função javascript faz o conteúdo escondido aparecer. Mas isso acho que é uma questão mais apropriada para o fórum de javascript.

[Ramael 0]

Dá uma olhada aqui: http://maujor.com/dicas/tooltip.php

 

sei lá.... dependendo do que você quer, de repente dá pra você dar uma adapatada nessa idéia do tooltip.

Eu já fiz um menu com isso e ficou bom...

 

 

t+

Ramael

[Marcos Knijnik 0]

Olá Marcos,

 

Para tal funcionalidade deve-se utilizar javascript, acho que não tem uma maneira de fazer apenas com HTML e CSS. Uma das maneiras de fazer é "esconder" a parte de mais detalhes utilizando CSS ou javascript e quando a pessoa clica no link "ver mais detalhes", uma função javascript faz o conteúdo escondido aparecer. Mas isso acho que é uma questão mais apropriada para o fórum de javascript.

 

Mas é exatamente isso que quero fazxer... só preciso saber como...

 

Ps.: É que eu programo mais em php, mysql e talz, e não manjo muito com isso...rs

[Ramael 0]

Bom.... já que o tooltip somente com o CSS não lhe ajudou ^^

...uma funçãozinha com JS ficaria mais ou menos assim:

 

mostra=0
function _mostraDivEscondido () {
var divEsc = document.getElementById("divEscondido");
if (mostra==0) {
	divEsc.style.display='block';
	mostra=1;
}
else {
	divEsc.style.display='none';
	mostra=0;
}
}

 

O div que conterá os tais detalhes a mostrar teria o ID="divEscondido", então quando você clicasse no botão "ver mais detalhes", chamaria essa função que trocaria o display none já especificado pelo CSS por block, aparecendo assim o DIV. Dentro desse DIV de detalhes poderia ter um botão "esconder", que chamaria novamente a função e trocaria o display block por none, sumindo com o div.

 

A posição desse DIV escondido, bem como dimensões e todos os outros estilos, já devem estar declarados no CSS, deixando pro JS somente a parte de mostrar e esconder.

 

O que essa funçãozinha faz, dependendo de qual é a idéia do seu site, pode ser feito somente com CSS, adaptando a tal dica do tooltip que postei antes.

 

...espero ter ajudado.

 

 

 

 

 

t+

Ramael

[Marcos Knijnik 0]

Obrigado, Ramael...

 

Aproveitando a deixa, será que você poderia me dizer como fazer para que quando uma pessoa estiver digitando seu CEP, por exemplo, e haja dois campos (um para os x de xxxxx-000 e o outro para os 000), ao digitar os cinco caracteres limites do primeiro campo (que tem limite de cinco caracteres), pule logo para o outro?

[Lucas Peperaio 20]

Obrigado, Ramael...

 

Aproveitando a deixa, será que você poderia me dizer como fazer para que quando uma pessoa estiver digitando seu CEP, por exemplo, e haja dois campos (um para os x de xxxxx-000 e o outro para os 000), ao digitar os cinco caracteres limites do primeiro campo (que tem limite de cinco caracteres), pule logo para o outro?

 

Você pode usar mascaras em jQuery, veja em meu site:

 

http://www.tutoriaisjquery.com.br/mascaras-em-jquery-masked-input/