Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

arthurcastro

onScroll JavaScript não funciona

Por , em Javascript

Recommended Posts

arthurcastro    0

arthurcastro
Postado

Gente instalei um efeito para quando o usuário rolar a página a imagem deslizar para a direita nessa página aqui (http://sophiseducacional.com.br/cursos/) só que o efeito acontece mesmo sem rolar a página.

O Java é esse:

<script>
	$(window).scroll(function() {
		$('#animatedElement').each(function(){
		var imagePos = $(this).offset().top;

		var topOfWindow = $(window).scrollTop();
			if (imagePos < topOfWindow+500) {
				$(this).addClass("slideRight");
			}
		});
	});
</script>

Já alterei o topOfWindow pra 80 pra testar o efeito nessa página mencionada só que nada funciona... E creio que o problema é realmente aí, porque o resto funciona perfeitamente...

Tem o css pra manter escondido até o usuário rolar a página também:

<style>
#img {
	visibility: hidden;
}
</style>

O que fazer?

Compartilhar este post

Link para o post
Compartilhar em outros sites

arthurcastro    0

arthurcastro
Postado

Criei um html simples pra vocês entenderem melhor. Era pro efeito acontecer quando o objeto está distante 400px do topo mas acontece mesmo sem rolar. O que está errado?

<html>
<title>ON SCROLL TEST</title>
<head>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<link rel="stylesheet" href="http://www.justinaguilar.com/animations/css/animations.css">
<style>
#object{
	background-color: #fe5652;

	visibility: hidden;
}
</style>
</head>
<body>
<script>
	$(window).scroll(function() {
		$('#object').each(function(){
		var imagePos = $(this).offset().top;

		var topOfWindow = $(window).scrollTop();
			if (imagePos < topOfWindow+400) {
				$(this).addClass("slideUp");
			}
		});
	});
</script>
<div style="height: 450px"></div>
<div id="object" class="slideUp">
TESTE <br> TESTE <br> TESTE <br> TESTE
</div>
<div style="height: 450px"></div>
</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito