cambiar divs con transición

sonia1982 · #1 (**permalink**) 24/01/2012, 18:41

Hola de nuevo!! sigo con mis dudas xD

Primero de todo pedir disculpas si este no es el foro indicado para mi pregunta, pero desde mi ignorancia me pareció el mas indicado

A ver, tengo un menu con diferentes links, en los que al pinchar, quiero mostrar una galeria de imagenes distintas. Lo que quiero es que al pinchar en un link distinto al que está activo, la galeria que se está mostrando (osea, el Div) desaparezca suavemente y aparezca suavemente la galería que he clickado (osea, que se muestre el Div que he seleccionado).

a ver si alguien me puede ayudar, que ando un poco perdida en este efecto :(

un besoooo! :)

madhatterdef · #2 (**permalink**) 25/01/2012, 08:57

puedes usar

fadeOut para desaparecer
fadeIn para aparecer

sonia1982 · #3 (**permalink**) 25/01/2012, 09:16

si, algo he oido de eso, pero no se como hacer para que al clickar en determinado enlace, el div que está activo desaparezca y aparezca el div que tiene que aparecer, ¿sabes de algun tutorial.. o algun codigo de ejemplo para descargar?

madhatterdef · #4 (**permalink**) 25/01/2012, 09:26

ej:
<html>
<head>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">

$(document).ready(function(){
$('.b').click(function () {
$(".div1").fadeOut(1000);
$(".div2").fadeIn(3000);
});
});

</script>
<style type="text/css">
body,html{height:100%}

.div1 {
position: absolute;
top:0px;
left:0px;
width:100%;
height:100%;
background-color:#f00;
z-index:2;

}
.div2 {
position:absolute;
top: 0px;
left: 0px;
width:100%;
height:100%;
background-color:#ccc;
z-index:1;
}
</style>
</head>
<div class="div1"><a href="#" class="b">lo que sea 1</a></div>
<div class="div2">lo que sea 2</div>
</body>
</html>

cualquier cosa pregunta

sonia1982 · #5 (**permalink**) 26/01/2012, 01:59

si, creo que esto me va a valer, lo he de probar bien a ver que tal.

muchisimas gracias madhatterdef :D

besoooo!

madhatterdef · #6 (**permalink**) 26/01/2012, 10:02

de nada cualquier cosa pregunta

sonia1982 · #7 (**permalink**) 28/01/2012, 04:44

Vale... lo he estado probando y no me funciona :(

De todas formas no es del todo lo que necesitaba.

Lo que necesito es algo como esto:

http://css-tricks.com/examples/OrganicTabs/

He probado descargandome ese archivo (está para descarga directa) pero me falla en algun sitio, entonces estoy buscando alguna otra manera de hacerlo sin ser con ese código.

Sabes si ese efecto tiene algun nombre en concreto (aunque sea en inglés)? o de alguna manera que pueda hacerlo?

De nuevo mil gracias!! :D

madhatterdef · #8 (**permalink**) 28/01/2012, 11:25

hay muchos ejemplos hay pero creo que lo que buscas es un slide