JS_Example_05

## 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>