Foros del Web - Ver Mensaje Individual

Dany_s · #10 (**permalink**) 10/08/2010, 16:48

en el mismo click tenés que buscar el div.cuerpo que está visible y ocultarlo, o mejor, guarda una referencia del objeto que mostras y en el mismo click del título ocultala antes, si no existe la referencia no haces nada y si existe es que hay uno abierto

Código HTML:

Ver original<head>
<title>EJEMPLO</title>
 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script>
$( function (){
 
    $(".titulo").click(function(){
 
        if (typeof last != 'undefined'){
            last.animate({
                width: "0px"
                }, 1500, function(){
                    $(this).css({display:"none"});
            });
        }
 
        last = $(this).closest('.contenedor').find('.cuerpo').animate({
            width: "396px"
        }, 1500 );
 
    });
});
</script>
<style>
.titulo {margin: 0; padding: 0; background-color: yellow; width: 300px; float: left; height: 60px;}
.cuerpo {margin: 0; padding: 2px; background-color: navy; color: red; width: 0px; float: left; display: none; height: 60px;}
.contenedor {padding: 0; background-color: yellow; width: 700px; display: table; height: 60px;}
</style>
</head>
 
<body>
<div class="contenedor">
<div class="titulo">Titulo 1</div>
<div class="cuerpo">asdasdasdasd</div>
</div>
 
<div class="contenedor">
<div class="titulo">Titulo 2</div>
<div class="cuerpo">aasddddddddddd</div>
</div>
 
<div class="contenedor">
<div class="titulo">Titulo 3</div>
<div class="cuerpo">aasdddddddasdsd</div>
</div>
</body>
</html>