Estoy tratando de animar mi pagina, con css3 animation que es una pagina que encontre por google y que pone instrucciones precisas de como hacer para que funcione.
La pagina en cuestion es esta:
http://www.justinaguilar.com/animations/index.html#
Aqui os pongo codigo de mi ejemplo ya que no es muy grande, ya que llevo 2 horas y media intentando que funcione y entre unas cosas y otras no se me ve nada!! y estoy que quiero matar a alguien...
El ejemplo esta hecho para que al hacer scroll a una distancia de 400 del top se me vea la animacion;
Código:
De verdad que lo he probado todo y no se porque esto no funciona, os agradezco desde ya a quien me ayude. un saludo, <!DOCTYPE html>
<html lang="en">
<head>
<link href="animacion.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
$(window).scroll(function() {
$('#objeto').each(function(){
var imagePos = $(this).offset().top;
var topOfWindow = $(window).scrollTop();
if (imagePos < topOfWindow+400) {
$(this).addClass("slideUp");
}
});
});
</script>
<style>
#objeto{
width: 30%;
height: 200px;
background-color: red;
visibility: hidden;
}
</style>
<meta charset="UTF-8">
<title>Animaciones</title>
</head>
<body>
<div id="objeto" class="slideUp"></div>
</body>
</html>
