Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Daniel V. Souza

[Resolvido] Como fazer um texto que esconde e aparece.

Por , em Javascript

Recommended Posts

Daniel V. Souza    0

Daniel V. Souza
Postado

Primeiro um bom dia para o pessoal ae! :lol:

Seguinte...

...Preciso saber como fazer um texto que fica escondido e quando clico em uma certa palavra ou certa imagem apareca o conteudo em baixo.

tipo Spoiler.

 

ou tipo esse aki do windows(prefiro Linux \o/) mesmo:

Imagem Postada

 

kkkkk tenho q ri mesmo +zinho e froid.(paint apavora)

 

Desde já agradeço vlw!

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

pesquise por menu tree

 

tem vários exemplos até aqui pelo fórum.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Um exemplo com jQuery:

http://forum.imasters.com.br/index.php?/topic/390741-menu-dropdown-c-jquery/page__view__findpost__p__1522569

 

Tente fazer, apresente o teu código.

No caso, diferente do que postei, o seu será ativado no click

Compartilhar este post

Link para o post
Compartilhar em outros sites

Daniel V. Souza    0

Daniel V. Souza
Postado

Esse que voce postou é um tipo de menu.(vlw a intenção)

Mas o que eu realmente preciso é que simplesmente(para quem conhece javascript hehe)que quando eu clique em uma palavra(titulo) o resto(conteudo) apareca em baixo.

 

EX:

 

*cliqueaki!(cliquei)

blabla bla bla bla bal bla bla bla bla bla bla("apareceu").

 

tipo aparece o texto ali em baixo como um paragrafo.

 

Desculpa se não estou conseguindo explicar hehe.

 

 

a minha empresa quer que eu coloque assim.

 

Nossa Misão:

e aki apareca a missão da empresa quando clicar em nossa missão sacou?

 

Vlw!

 

---------EDIT-----------

kkkkkkkkkkkkkkkkkkkkkk ficou 2 exemplos praticamente identicos!

hehe mlz

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Esse que voce postou é um tipo de menu.(vlw a intenção)

Mas o que eu realmente preciso é que simplesmente(para quem conhece javascript hehe)que quando eu clique em uma palavra(titulo) o resto(conteudo) apareca em baixo.

 

Cara, você postou um menu! :huh:

 

Enfim... veja:

<html>
<head>
<script type="text/javascript">
function id( el ){
	return document.getElementById( el );
}
function show( el )
{
	if( id( el ).style.display=='none' )
		id( el ).style.display = 'block';
	else
		id( el ).style.display = 'none';
}
window.onload = function()
{
	id( 'p-clique-aqui' ).style.display = 'none';
	id( 'p-nossa-missao' ).style.display = 'none';
}
</script>
</head>
<body>
	<h1 onclick="show( 'p-clique-aqui' )">Clique Aqui</h1>
	<p id="p-clique-aqui">blabla bla bla bla bal bla bla bla bla bla bla("apareceu").</p>


	<h1 onclick="show( 'p-nossa-missao' )">Nossa Missão</h1>
	<p id="p-nossa-missao">e aki apareca a missão da empresa quando clicar em nossa missão sacou? </p>	
</body>
</html>
se você tivesse olhado o código que postei, poderia adaptar, e extrair essa parte que precisa. :P

Compartilhar este post

Link para o post
Compartilhar em outros sites

visitante_xp    0

visitante_xp
Postado

Maninho, tem como fazer isso em jquery como o @William falou. Tem diversas formas, a que ele mostrou é apenas uma. E boa pois da pra navegar por varios niveis, é mecher no código.

 

Eu usei uma forma que não sei se da pra ir mais de um nivel. Tenta ai.

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[url="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd[/url]">
<html xmlns="[url="http://www.w3.org/1999/xhtml"]http://www.w3.org/1999/xhtml[/url]">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
li ul{display:none;}
</style>
<script type="text/javascript" src="javascript/jquery.js"></script>
<script type="text/javascript">
$(function(){
$("#clica").click(function(){
 $("#cont").animate({height: 'toggle', opacity: 'toggle'},"slow");
});
 	});
</script>
</head>

<body>
<ul>
 <li><a href="#" id="clica">Inicio</a>
	 <ul id="cont">
    	 <li>1</li>
        	<li>2</li>
        	<li>3</li>
	 </ul>
	</li>
	
</ul>
</body>
</html>

Abraço!!!

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Esse trecho do meu script, esconde eles:

window.onload = function()
{
        id( 'p-clique-aqui' ).style.display = 'none';
        id( 'p-nossa-missao' ).style.display = 'none';
}
qual código você testou ?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Daniel V. Souza    0

Daniel V. Souza
Postado

Esse trecho do meu script, esconde eles:

window.onload = function()
{
        id( 'p-clique-aqui' ).style.display = 'none';
        id( 'p-nossa-missao' ).style.display = 'none';
}
qual código você testou ?

 

ops foi malz ta funcionando!

ehuahau tinha eskecido de fexa ">" ehaeau

vlw msm !!

Fote Abraço!

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito