Preguntas Frecuentes Desplegables

rodeirojg · #1 (**permalink**) 15/06/2012, 13:15

Hola gente del foro!

Estoy haciendo una sección de mi web con algunas FAQ's, pero me gustaría incluír algún javascript que me permita hacerlas desplegables. Exactamente como el ejemplo de esta web:

http://compania.herbalife.com.ar/preguntas-frecuentes

emprear · #2 (**permalink**) 15/06/2012, 13:53

Algo como esto

Código HTML:

Ver original<!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">
<head>
<title>mostrar oculta capas</title> 
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type="text/css">
/*<![CDATA[*/
p{
font-weight: bold;
cursor: pointer;
}
#Uno,#Dos,#Tres{
display: none;
}
/*]]>*/
</style>
<script type="text/javascript">
//<![CDATA[
function contenido(cual){
var capas = new Array("Uno", "Dos", "Tres");
var i;
    for(i in capas){
        if(capas[i] == cual){
        document.getElementById(capas[i]).style.display = 'block';
        }else{
        document.getElementById(capas[i]).style.display = 'none';
        }
    }
}
//]]>
</script>
</head>
<body>
<p onclick="contenido('Uno')" >uno</p>
<div id="Uno">Texto uno</div>
<p onclick="contenido('Dos')" >dos</p>
<div id="Dos">Texto dos</div>
<p onclick="contenido('Tres')" >tres</p>
<div id="Tres">Texto tres</div>
</body>
</html>

Saludos