Ir para conteúdo

POWERED BY:

Arquivado

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

VinnYSPL

como configurar toggle

Por , em Javascript

Recommended Posts

VinnYSPL    0

VinnYSPL
Postado

Ola pessoal e o seguinte eu tenho um toggle aqui para exibir uma div com resultados dinâmicos.

Mas eu queria exibir o resultado de uma vez so, mas so consigo mostrar o resultado depois do que clicar mostrar/esconder .

vou postar o código que e do maujor.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="pt-br">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Toggle texto</title>
<style type="text/css" media="all">
#box-toggle {
	width:500px;
	margin:0 ;
	text-align:justify;
	font:12px/1.4 Arial, Helvetica, sans-serif;
	}
#box-toggle .tgl {margin-bottom:30px;}
#box-toggle span {
	display:block;
	cursor:pointer;
	font-weight:bold;
	font-size:14px;
	color:#c30; 
	margin-top:15px;
	}
</style>
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript"> 
jQuery.fn.toggleText = function(a,B) {
return   this.html(this.html().replace(new RegExp("("+a+"|"+b+")"),function(x){return(x==a)?b:a;}));
}

$(document).ready(function(){
	$('.tgl').before('<span>Revelar conteúdo</span>');
	$('.tgl').css('display', 'none')
	$('span', '#box-toggle').click(function() {
		$(this).next().slideToggle('slow')
		.siblings('.tgl:visible').slideToggle('fast');
	
		$(this).toggleText('Revelar','Esconder')
		.siblings('span').next('.tgl:visible').prev()
		.toggleText('Revelar','Esconder')
	});
})
</script>
</head>
<body>
<div id="box-toggle">

<div class="tgl">

<h2>Conteúdo um</h2>
<p>Teste 1</p>
</div>

<div class="tgl">
<h2>Conteúdo dois</h2>
<p>Conteúdo 2</p>
</div>

<div class="tgl">
<h2>Conteúdo três</h2>
<p>jQuery</p>
</div>

</div>

</body>
</html>

Bom agradeço se vocês poderem me ajudar.

Compartilhar este post

Link para o post
Compartilhar em outros sites

brcontainer    16

brcontainer
Postado

Amigo use a função each: http://api.jquery.com/each/

Algo tipo(obs nao testei):

 

 

$('span', '#box-toggle').click(function() {                $(this).next().slideToggle('slow')                .siblings('.tgl:visible').slideToggle('fast');                        $(this).toggleText('Revelar','Esconder')                .siblings('span').next('.tgl:visible').prev()                .toggleText('Revelar','Esconder')        });        $('span', '#box-toggle').each(function(index) {                $(this).next().slideToggle('slow')                .siblings('.tgl:visible').slideToggle('fast');                        $(this).toggleText('Revelar','Esconder')                .siblings('span').next('.tgl:visible').prev()                .toggleText('Revelar','Esconder')        });

Atenciosamente Silverfox

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