Skip to content

Instantly share code, notes, and snippets.

@juno
Created April 9, 2011 14:00
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save juno/911411 to your computer and use it in GitHub Desktop.
Save juno/911411 to your computer and use it in GitHub Desktop.
jQuery Waypoints Plugin exercise
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery Waypoints exercise</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script src="waypoints.min.js"></script>
<script src="pages.js"></script>
</head>
<body>
<h1>jQuery Waypoints exercise</h1>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section class="entry"><h2>Hello!</h2></section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
<section>Hello!</section>
</body>
</html>
$(function() {
$('.entry').waypoint(function(event, direction) {
if (direction == 'up') {
$('body').css({backgroundColor: 'white'});
} else if (direction == 'down') {
$('body').css({backgroundColor: 'red'});
}
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment