Skip to content

Instantly share code, notes, and snippets.

@craigprotzel

craigprotzel/JS_Example_05

Created August 9, 2013 14:53
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 craigprotzel/6194264 to your computer and use it in GitHub Desktop.
Save craigprotzel/6194264 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
JS_Example_05
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Scroll demo</title>
<style>
div {
color:blue;
}
p {
color:green;
}
span {
color:red;
display:none;
}
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$( document ).ready( function(){
$(window).scroll(function () {
$("span").css("display", "inline").fadeOut("slow");
var scrollAmount = $('body').scrollTop();
console.log(scrollAmount);
});
});
</script>
</head>
<body>
<div>Try scrolling the iframe.</div>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
<p>Paragraph - <span>Scroll happened!</span></p>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment