Why doesn't it work? [Web-Dev]

Jeroen1322 · June 12, 2014

Hi guys!

I'm working on a presentation about myself in the form of a website and i got all the contect but the website was very boring and now i want to make it more like a presentation and when you scroll down the new text apairs. I have found a way to do it frome here but now it activates when i'm not close to the object when scrolling, even when i refresh it activates. There is some script to activate it when you're scrolling but that doesn't even work.. You can set the amount of pixels above the object for activation but that doesn't help.

<!DOCTYPE HTML><html>	<head>		<title>TEST</title>		<link rel="stylesheet" href="animations.css">		<link href="style.css" rel="stylesheet" type="text/css"  media="all" />		<link href='http://fonts.googleapis.com/css?family=Karla' rel='stylesheet' type='text/css'>		<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>		<script type="text/javascript">		jQuery(document).ready(function($) {			$(".scroll").click(function(event){						event.preventDefault();				$('html,body').animate({scrollTop:$(this.hash).offset().top},1200);			});		});		</script>		<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>		<link rel="stylesheet" href="css/animations.css">				<style type="text/css">		#object{			visibility: hidden;		};		</style>	</head><body><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><div id="object" class="slideRight"><h3>TEST</h3><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><script>	$(window).scroll(function() {		$('#object').each(function(){		var imagePos = $(this).offset().top;		var topOfWindow = $(window).scrollTop();			if (imagePos < topOfWindow+10) {					$(this).addClass("slideRight");			}		});	});</script></body></html>

Sorry for all the <br />'s

(The 10 after 'topOfWindow+' is the amount of pixels about to object to activate')

Thanks!

This is how it works