08/04/2012, 04:34
|
| | Fecha de Ingreso: diciembre-2011 Ubicación: Argentina
Mensajes: 88
Antigüedad: 13 años Puntos: 4 | |
Problema Buenos días! tengo una duda, para el que tiene twitter no va a tener probleam en entenderme xD
Les cuento como funciona, al darle click al SPAN: Código HTML: <span class="abrir_datos">Click!</span> Se despliega: Código HTML: <div class="desplegar_info_vd">
<p>aaaaaaaaaaaaaaaaaaaaaaa</p>
<p>bbbbbbbbbbbbbbbbbbbbbbb</p>
<p><a href="#">cccccccccccccccc</a></p>
</div> Al darle click de nuevo se oculta. Ahí vamos bien, pero lo que quiero lograr es que al desplegar cualquiera de esos divs (uno o dos, como se ve en el ejemplo) aparezca una imagen que al cliquearla cierre todos los divs anteriormente mostrados y además que esa imagen desaparezca. Eso lo logre peeeroooo, si despliego un DIV, aparece la imagen, todo bien, peroooo al ocultar el/los DIV desplegado con el SPAN (en vez de la imagen para cerrarlos a todos) el DIV... Código HTML: <div id="cerrar_todo">
</div> ...sigue viendose.
Osea lo que quiero es que al cerrar los DIVS desplegados (Cliqueando en el SPAN de cada uno) ese <div id="cerrar_todo"> desaparezca por más de que no haya sido utilizado ya que de nada va a servir porque estan todos los DIV plegados.
El DIV con class=".desplegar_info_vd" tiene un display: none; Código HTML: <!-- Boton para cerrar todo lo desplegado -->
<div id="cerrar_todo">
</div>
<!-- Aquí el div/section donde ira el contenido -->
<div id="contenedor">
<div class="opciones">
<p>HHHHHHHHHHHHH</p>
<span class="abrir_datos">Click!</span> <!-- Al clikearlo se abrira el DIV siguiente -->
<div class="desplegar_info_vd">
<p>aaaaaaaaaaaaaaaaaaaaaaa</p>
<p>bbbbbbbbbbbbbbbbbbbbbbb</p>
<p><a href="#">cccccccccccccccc</a></p>
</div>
</div>
<div class="opciones">
<p>HHHHHHHHHHHHHH</p>
<span class="abrir_datos">Click!</span> <!-- Al clikearlo se abrira el DIV siguiente -->
<div class="desplegar_info_vd">
<p>aaaaaaaaaaaaaaaaaaaaaa</p>
<p>bbbbbbbbbbbbbbbbbbbbbb</p>
<p><a href="#">ccccccccccccccc</a></p>
</div>
</div>
</div>
Código Javascript :
Ver original//cerrar todo lo desplegado $('#cerrar_todo').hide(); //lo oculto $('.abrir_datos').click(function(){ //si lo preciono ("click!") $('#cerrar_todo').fadeIn(); //mostrar .cerrar_todo }); $('#cerrar_todo').click(function(){ //al cliquear #cerrar_todo $('.desplegar_info_vd').slideUp(); //cierro la info desplegada $('#cerrar_todo').fadeOut(); // y oculto el botón cliqueado }); //hacer que #cerrar_todo desaparezca si se plegaron todos los divs SIN utilizarlo. ¿?
Si saben como resumir el codigo no me vendría mal que me lo hagan saber
Última edición por Cotelandia; 08/04/2012 a las 04:40 |