entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

2votos

animaciones al hacer scroll

hola mi duda es como puedo hacer para que me aprezcan animaciones al hacer scroll a una pagina y en javascrip me jale una determinada animacion de una hoja de estilos este es mi codigo.

<!doctype html>
<html>
<head>
    <title>Scroll Effect</title>
    <style type="text/css">
    *{
        margin: 0;
        padding: 0;
    }
    .cabecera{
        height: 400px;
    }
    .cont-magia{
        height: 450px;
        width: 100%;

        background: #ccc;

    }
    #magia
    {
        transition:all 1s;  
    }
    .pie {
        height: 700px;
    }
    .piee
    {
        height: 800px;
    }
    </style>

</head>
<body>
<div class="cabecera"></div>
<div class="cont-magia">
    <h1 id="magia">hola mundo</h1>
</div>
<div class="pie">

</div>
<div class="piee">

</div>

<script type="text/javascript">
function Scroll(){
var top = document.getElementById('magia');
var ypos = window.pageYOffset;
if(ypos > 1) {
    top.style.opacity = "1";
}
else{
    top.style.opacity = "0";
    }
}
    window.addEventListener("scroll",Scroll);

</script>
</body>
</html>

0voto

Peter comentado

Tendrías que definir animaciones y ser específico en lo que quieres.

Desgraciadamente animaciones hay cientos de miles, entonces sería más fácil que digas algo exacto para así poderte dar un ejemplo.

Saludos.

0voto

elarsoft comentado

la animaciones no me preocupan por que ya tengo varias animaciones lo que quiero es que al hacer scroll ala pagina me aprezcan las animaciones segun vaya bajando

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Conecta