Mudar nome do conteúdo esconder conteudo
Olá, estou precisando de uma ajuda simples, estou com esse código pronto, peguei do www.maujor.com e queria mudar o nome que aparece nos dois campos.
por exemplo:
download 1
(ao clicar acima exibe o download 1)
download 2 suporte
(ao clicar acima exibe o download 2 suporte).
do jeito que esta, aparece só "revelar conteúdo" e "esconder conteúdo" porque ja esta escrito no js.
segue o código.
e creio que deva ser simples, mas tentei fazer e aparentemente eu teria que adicionar mais código, pela a tentativa que fiz não deu certo. Obrigado desde já.
http://codepen.io/d4v1/pen/GWOzGK
<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 auto;
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="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.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>conteudo aqui 11</p>
</div>
<div class="tgl">
<h2>Conteúdo dois</h2>
<p>conteudo aqui 22</p>
</div>
</div>
</body>
</html>Discussão (14)
Carregando comentários...