Me gustaria saber el script de este efecto

BaSingSe · #1 (**permalink**) 11/10/2012, 12:41

Hola me he pasado una noche entera tratando de entender el codigo para hacer este efecto ... http://makr.com/#home ... el que tienen las billeteras cuando le das click, se hacer por css pero asi solo me aparece el cuadro de golpe y me gustaria que apareciera asi despacio con animacion oh si alguien se sabe el nombre de este efecto se lo agradeceria en el alma..... muchas gracias

BaSingSe · #2 (**permalink**) 11/10/2012, 12:45

asi es que lo tengo no se en que estoy fallando...

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin título</title>
<style>
body{ margin:0px;}
#header{ background-color:#000000; height:250px; width:auto;}
#oculto{ background-color:#FF9999; height:350px; width:auto; display:none;}
.aparece{display:inherit;}
#header2{background-color:#CC3300; height:150px; width:auto;}

</style>
<script>
function aparecer(){
var element = document.getElementById("oculto");
elemento.className = "aparece";

}
</script>
</head>

<body>
<div id="header"></div>
<div id="oculto"></div>
<div id="header2"></div>
<div id="body">
<div id="info"><a href="#" onclick="aparecer();">informacion</a></div>
</div>
</body>

Dradi7 · #3 (**permalink**) 11/10/2012, 13:40

Pero tu error esta clarisimo mira aqui

var element = document.getElementById("oculto");

y mira como lo llamas

elemento.className = "aparece";

debes quitarle la o

Saludos

BaSingSe · #4 (**permalink**) 11/10/2012, 13:59

wow se me escapo eso gracias, pero aun asi no funciona :(

Dradi7 · #5 (**permalink**) 11/10/2012, 14:03

Esto ya es cuestion porque el ID esta tomandolo como estilo principal, en vez de usar el estilo como id hazlo como clases asi

<div id="oculto" class="oculto" />

Código CSS:

Ver original.oculto{
    display:none;
}
.aparece{
    display:block;
}

En tu JS

Código Javascript:

Ver originalvar element = document.getElementById("oculto");
element.className = "aparece";

BaSingSe · #6 (**permalink**) 11/10/2012, 14:35

yaaaaaaaaaaaa lo resolvi le hice algunos arreglitos porque me lo estaba haciendo inverso a lo que queria millon de gracias, ahora si no es problema me gustaria hacerte 2 preguntas mas para que te libres de mi.... si viste en la pagina que deje arriba el efecto de que abre la informacion cunado le das a una billetera es el efecto que trato de hacer, el cuadro me aparece pero de golpe tengo por ahi el script para hacerlo bajar lento, pero lo que mas quisiera es el script para que cuando aparesca el cuadro asi mismo baje el scroll a donde este, osea que baje a donde aparecio el cuadro y pues si no sabes coomo :(, mi otra pregunta seria sabes el nombre de ese efecto¿? gracias de antemano :D

Dradi7 · #7 (**permalink**) 11/10/2012, 14:45

si no me equivoco creo que es

fadeIn
fadeOut

del jQuery

BaSingSe · #8 (**permalink**) 11/10/2012, 15:23

siii ese es de nuevo millon de gracias..... :) post solucionado!!