Untitled

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Test</title>
  <link rel="stylesheet" href="style.css" />
  <link rel="stylesheet" href="animate.css" />
  <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script src="waypoints.js"></script>
</head>
<body>
    <div class="blognews">Header Content</div>
    <div style="height:1200px;width:100%"></div>
    <div class="blognews">Footer Content</div>
    <div style="height:1200px;width:100%"></div>
</body>
  <script>
    $('.blognews').waypoint(function(direction) {
      $('.blognews').addClass('animated fadeInRight');
    });
  </script>
</html>