Ver Mensaje Individual
  #1 (permalink)  
Antiguo 04/11/2010, 11:29
Anonimo12
 
Fecha de Ingreso: abril-2009
Ubicación: En foros del web, normalmente en Web general, HTML y CSS.
Mensajes: 258
Antigüedad: 15 años
Puntos: 3
Enlazar desplegables

Buenas a todos, les planteo una cuestión en referencia a un desplegable (spoitler simple):

Código:
<dl class="codebox" style="cursor: pointer;" onclick="this.getElementsByTagName('div')[0].style.display=((this.getElementsByTagName('div')[0].style.display=='none')?'':'none');">
<dt>Nombre 1</dt><dd><div style="display:none;"><br />Contenido 1</div></dd></dl>

<dl class="codebox" style="cursor: pointer;" onclick="this.getElementsByTagName('div')[0].style.display=((this.getElementsByTagName('div')[0].style.display=='none')?'':'none');">
<dt>Nombre 2</dt><dd><div style="display:none;"><br />Contenido 2</div></dd></dl>

<dl class="codebox" style="cursor: pointer;" onclick="this.getElementsByTagName('div')[0].style.display=((this.getElementsByTagName('div')[0].style.display=='none')?'':'none');">
<dt>Nombre 3</dt><dd><div style="display:none;"><br />Contenido 3</div></dd></dl>
La pregunta es: ¿Hay alguna manera de enlazar los desplegables y que al abrirse uno se cierren los demás?.

Seguí un ejemplo puesto por Empear en otro tema (http://foros.emprear.com/mostrarcapas/titulos.html#), sin embargo quisiera usarlo en tablas y evitar el tener que señalar en cada desplegable todos los que se tienen que cerrar (ya que si necesito usar 100 en una sola entrada no es rentable que en cada desplegable defina que se deben cerrar los otros 99) como podéis ver aqui (sacado del código fuente del ejemplo):

Código:
<div>
<a href="#" onclick="m_oCapas('cancion_uno','','ver','cancion_dos','','ocultar','cancion_tres','','ocultar','cancion_cuatro','','ocultar')">
Unicornio (S. Rodriguez)</a><br />

<div class="letras" id="cancion_uno" style="display: none;">
Mi unicornio azul ayer...
</div>
<a href="#" onclick="m_oCapas('cancion_uno','','ocultar','cancion_dos','','ver','cancion_tres','','ocultar','cancion_cuatro','','ocultar')">
Mariana (S. Rodriguez)</a><br />
<div class="letras" id="cancion_dos" style="display: none;">
Siempre hay quien quisiera ser distinto...
</div>
<a href="#" onclick="m_oCapas('cancion_uno','','ocultar','cancion_dos','','ocultar','cancion_tres','','ver','cancion_cuatro','','ocultar')">
Verbos en juego (S. Rodriguez)</a><br />
<div class="letras" id="cancion_tres" style="display: none;">
Si tu signo es jugar, juégalo todo...
</div>
<a href="#" onclick="m_oCapas('cancion_cuatro','','ver','cancion_dos','','ocultar','cancion_tres','','ocultar','cancion_cuatro','','ver')">
Mujer con sombrero (S. Rodriguez)</a><br />

<div class="letras" id="cancion_cuatro" style="display: none;">
Una Mujer se ha perdido
</div>
</div>
Si existe alguna manera desde el tipo de desplegable que puse en el primer código ya sea añadiendo un código CSS o algo parecido les agradecería que me comentaran, saludos =)
__________________
¿Por qué Anónimo?, porque como está el mundo no podemos considerarnos humanos...