Lazy Load Image and Lazy Load/Viewport autoplay video using waypoints.js. Both of these load using class-based triggers.

examples.html

<!-- Lazy Load Image Example -->
<img data-src="img/img-src.jpg" class="lazyLoadImg lazyLoadImgFade" alt="Descriptive alt text" width="1280" height="945" src="http://1x1px.me/FFFFFF-0.png">

<!-- Lazy Load Video Background example (using bootstrap) -->

<div class="container-fluid">
      <div class="video-bg-container backgroundgradient">
        <video class="bigvideo lazyLoadVid viewportAutoPlay" autoplay loop poster="img/Main-Vid-Summary-Broadband-High.jpg" id="video1">
          <source src="img/Main Vid Summary-Broadband High.mp4" type="video/mp4">
          <source src="img/Main Vid Summary-Broadband High.webm" type="video/webm">
        </video>
      </div>
</div>

<!-- async loading of lazy load images and video this needs to be at the bottom of body, before the </body> element -->
<script src="js/jquery.waypoints.min.js"></script>
<script src="js/jquery.lazyloadimg-min.js?v=1.1.3"></script>
<script src="js/jquery.lazyloadvid-min.js?v=0.1.1"></script>
<!-- /async load of lazy images and video -->

jquery.lazyloadimg-min.js

/*!
jquery.lazyLoadImg-min - 1.1.3
Copyright © 2016 Kevin Garcia, Stanford University
Released under the The MIT License (MIT)
Requires jquery.waypoints
Minified with jscompress.com
*/

function checkViewport(){viewportWidth=$(window).width(),viewportWidth>768?$fadeTarget="95%":$fadeTarget="200%","true"==lazyLoadImgDebug&&console.log("fade target is "+$fadeTarget)}function lazyLoadImg(a){var e=a;e.attr("src")!==$placeholder&&(e.attr("src",$placeholder),"true"==lazyLoadImgDebug&&console.log("%cset img src of "+e.attr("data-src")+" to "+e.attr("src"),"color:orange;")),"true"==lazyLoadImgDebug&&console.log("%clazy loading "+e.attr("data-src"),"color:green;"),checkViewport(),$(e).waypoint(function(){e.addClass("lazy-loading"),e.attr("src",e.attr("data-src")),e.hasClass("lazy-loading")&&this.disable(),"true"==lazyLoadImgDebug&&console.log("%cset src to "+e.attr("src")+" at 200%","color:green;"),Waypoint.refreshAll(),"true"==lazyLoadImgDebug&&console.log("refreshing All waypoints")},{offset:"350%"}),e.hasClass("lazyLoadImgFade")?$(e).waypoint(function(){e.removeAttr("data-src"),e.addClass("lazy-loaded"),e.hasClass("lazy-loaded")&&(e.removeClass("lazy-loading"),this.disable()),"true"==lazyLoadImgDebug&&console.log("%c"+e.attr("src")+" made visible at "+$fadeTarget,"color:green;")},{offset:$fadeTarget}):(e.attr("src",e.attr("data-src")),e.removeAttr("data-src"),e.addClass("lazy-loaded"),e.removeClass("lazy-loading"),"true"==lazyLoadImgDebug&&console.log("%c"+e.attr("src")+" made visible immediately","color:green;"))}var lazyLoadImgDebug="false",$placeholder="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==";$("img.lazyLoadImg").each(function(){var a=$(this);lazyLoadImg(a)});var resizing=!1;$(window).on("resize",function(){resizing!==!1&&clearTimeout(resizing),resizing=setTimeout(checkViewport,200)}).resize();

jquery.lazyloadimg.css

/* Required for LazyLoad Images */
img.lazy-loading {
  opacity: 0.08;
}
img.lazy-loaded {
  -webkit-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;
}
img.loaded.lazy-loading {
  opacity: 1;
}
/* / Lazy Load Images */

jquery.lazyloadimg.js

/*!
jquery.lazyLoadImg - 1.1.3
Copyright © 2016 Kevin Garcia, Stanford University
Released under the The MIT License (MIT)
--------------------------------------------------------------
*/

// Dependent on jquery.waypoints
// Use jscompress.com to minify for production if you modify this script.
// Turn debug to false before minifying.

// -----------------------------------------------------------
// lazyLoadImg Configuration
// -----------------------------------------------------------

// LazyLoadImg Debug Messages
// 'true' displays status messages in console.log. 
// 'fase' just runs through the code and ignores status messages.
// This is primarily useful when debugging or adding functionality.
var lazyLoadImgDebug='false';

// Image Placeholder: 
// the relative or absolute path of whatever placeholder image
// you wish to use.
var $placeholder='data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==';

// Initialize lazyLoadImg Function Calls
$('img.lazyLoadImg').each(function() {
  var img = $(this);
  lazyLoadImg(img);
});

// -----------------------------------------------------------
// lazyLoadImg Functions
// -----------------------------------------------------------

// Check Viewport

function checkViewport() {
  viewportWidth = $(window).width();
  if (viewportWidth > 768) {
    // Desktop fade target
    $fadeTarget = '95%';
  }
  else {
    // Mobile fade target
    $fadeTarget = '200%';
  };
  if (lazyLoadImgDebug == 'true') {
    console.log('fade target is ' + $fadeTarget);
  };
  
}

var resizing = false;
$(window).on('resize', function () {
  if(resizing !== false)
    clearTimeout(resizing);
  resizing = setTimeout(checkViewport, 200);
}).resize();

// lazyLoadImg
function lazyLoadImg(img) {
  var $img=img;
  // replace image source with 1px transparent PNG for positioning
  if($img.attr('src') !== $placeholder) {
    $img.attr('src',$placeholder)
        if (lazyLoadImgDebug == 'true') {
          console.log('%cset img src of ' + $img.attr('data-src') + ' to ' + $img.attr('src'), 'color:orange;')
        };
  };
  // Waypoint lazy loader
  if (lazyLoadImgDebug == 'true') {
   console.log('%clazy loading ' + $img.attr('data-src'), "color:green;")
  };
  // 
  // Check viewport Width
  checkViewport();

  // Reset image source on waypoint
  $($img).waypoint(function() {
    $img.addClass("lazy-loading")
    $img.attr('src',$img.attr('data-src'))
    if($img.hasClass ( "lazy-loading")) {
      this.disable() // disables waypoint once image has started loading
    };

    if (lazyLoadImgDebug == 'true') {
      console.log('%cset src to ' + $img.attr('src') + ' at 200%', "color:green;")
    };

      
    Waypoint.refreshAll()
    if (lazyLoadImgDebug == 'true') {
      console.log('refreshing All waypoints')
    }
  },{
    // Point at which image loads into DOM 
    offset:'350%'
  });

  if($img.hasClass( "lazyLoadImgFade" )) {
    // Waypoint Fade in after load
    $($img).waypoint(function() {
      $img.removeAttr('data-src')
      $img.addClass("lazy-loaded")
      if($img.hasClass ( "lazy-loaded")) {
        $img.removeClass("lazy-loading")
        this.disable() // disables waypoint once image has loaded
      };
      if (lazyLoadImgDebug == 'true') {
        console.log('%c' + $img.attr('src') + ' made visible at ' + $fadeTarget, "color:green;")
      };
    },{ 
      offset:$fadeTarget
      // continuous: true
    });
  } else {
    $img.attr('src', $img.attr('data-src'))
    $img.removeAttr('data-src')
    $img.addClass("lazy-loaded")
    $img.removeClass("lazy-loading")
    if (lazyLoadImgDebug == 'true') {
      console.log('%c' + $img.attr('src') + ' made visible immediately', "color:green;");
    };
  }
};

jquery.lazyloadvid-min.js

/*!
jquery.lazyLoadVid-min - 0.1.1
Copyright © 2016 Kevin Garcia, Stanford University
Released under the The MIT License (MIT)
Requires jquery.waypoints
*/

function lazyLoadVidTogglePlay(o){"true"==lazyLoadVidDebug&&console.log(" • setting lazyLoadVidTogglePlay function for "+o+" ...");var e=$("#"+o).parent();$(e).click(function(e){"true"==lazyLoadVidDebug&&console.log("click detected on "+o);var a=$("#"+o).get(0);a.paused?(a.play(),"true"==lazyLoadVidDebug&&console.log("playing "+o)):(a.pause(),"true"==lazyLoadVidDebug&&console.log("pausing "+o))})}function lazyLoadVidPreLoad(o){"true"==lazyLoadVidDebug&&console.log("%cConfiguring "+o+" preload for "+o+" ...","color: green;"),$(o).attr("preload","none"),$(o).waypoint(function(){"true"==lazyLoadVidDebug&&console.log("%cpreloading "+o,"color: orange;"),$(o).attr("preload","auto"),this.disable(),Waypoint.refreshAll()},{offset:"300%"})}function lazyLoadVidPlayDown(o){"true"==lazyLoadVidDebug&&console.log(" • setting lazyLoadVidPlayDown function for "+o+" ..."),$(o).waypoint(function(e){if("down"===e){"true"==lazyLoadVidDebug&&console.log("playing down on "+o);var a=$(o).get(0);a.play()}},{offset:"100%"})}function lazyLoadVidPauseDown(o){"true"==lazyLoadVidDebug&&console.log(" • setting lazyLoadVidPauseDown function for "+o+" ..."),$(o).waypoint(function(e){if("down"===e){"true"==lazyLoadVidDebug&&console.log("pausing down on "+o);var a=$(o).get(0);a.pause()}},{offset:"-100%"})}function lazyLoadVidPlayUp(o){"true"==lazyLoadVidDebug&&console.log(" • setting lazyLoadVidPlayUp function for "+o+" ..."),$(o).waypoint(function(e){if("up"===e){"true"==lazyLoadVidDebug&&console.log("playing up on "+o);var a=$(o).get(0);a.play()}},{offset:"-100%"})}function lazyLoadVidPauseUp(o){"true"==lazyLoadVidDebug&&console.log(" • setting lazyLoadVidPauseUp function for "+o+" ..."),$(o).waypoint(function(e){if("up"===e){"true"==lazyLoadVidDebug&&console.log("pausing down on "+o);var a=$(o).get(0);a.pause()}},{offset:"100%"})}!function(o){(jQuery.browser=jQuery.browser||{}).mobile=/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(o)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(o.substr(0,4))}(navigator.userAgent||navigator.vendor||window.opera);var lazyLoadVidDebug="false";"true"==lazyLoadVidDebug&&console.log(" • jQuery.browser.mobile is "+jQuery.browser.mobile),$("video.lazyLoadVid").each(function(){var o=$(this).attr("id");0==jQuery.browser.mobile&&lazyLoadVidPreLoad("#"+o)}),$("video.viewportAutoPlay").each(function(){var o=$(this).attr("id");0==jQuery.browser.mobile?("true"==lazyLoadVidDebug&&console.log("%cConfiguring "+o+" for desktop devices:","color: green;"),lazyLoadVidTogglePlay(o),lazyLoadVidPlayDown("#"+o),lazyLoadVidPauseDown("#"+o),lazyLoadVidPlayUp("#"+o),lazyLoadVidPauseUp("#"+o)):("true"==lazyLoadVidDebug&&console.log("%cConfiguring "+o+" for mobile devices:","color: green;"),$(o).removeAttr("autoplay"),"true"==lazyLoadVidDebug&&console.log(" • Disabling autoplay on mobile devices ..."),$(o).removeAttr("loop"),"true"==lazyLoadVidDebug&&console.log(" • Disabling autoplay on mobile devices ..."))}),$("video.mobileVideoTogglePlay").each(function(){var o=$(this).attr("id");0==jQuery.browser.mobile?("true"==lazyLoadVidDebug&&console.log("%c • Remove video controls for desktop devices on "+o,"color: green;"),$(this).removeAttr("controls"),$(this).removeClass("controls-on")):("true"==lazyLoadVidDebug&&console.log("%cConfiguring "+o+" for mobile device toggle play","color: green;"),lazyLoadVidTogglePlay(o))});

jquery.lazyloadvid.js

/*!
jquery.lazyLoadVid - 0.1.1
Copyright © 2016 Kevin Garcia, Stanford University
Released under the The MIT License (MIT)
Requires jquery.waypoints
*/

// ---------------------------------------------------------------------------------
// Using: http://detectmobilebrowsers.com/
// jQuery.browser.mobile will be true if the browser is a mobile device
// ---------------------------------------------------------------------------------
(function(a){(jQuery.browser=jQuery.browser||{}).mobile=/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(a.substr(0,4))})(navigator.userAgent||navigator.vendor||window.opera);


// ---------------------------------------------------------------------------------
// lazyLoadVid Functions
// ---------------------------------------------------------------------------------

// VidPlay
function lazyLoadVidTogglePlay(videoID) {
  if (lazyLoadVidDebug == 'true') {
    console.log(' • setting lazyLoadVidTogglePlay function for ' + videoID + ' ...');
  }
  var vidContainer = $('#' + videoID).parent();
  $(vidContainer).click(function(clickedID) {
    if (lazyLoadVidDebug == 'true') {
     console.log('click detected on ' + videoID)
    }
    var video = $('#' + videoID).get(0)
     if (video.paused) {
        video.play()
        if (lazyLoadVidDebug == 'true') {
          console.log('playing ' + videoID);
        }
     } else {
        video.pause()
        if (lazyLoadVidDebug == 'true') {
          console.log('pausing ' + videoID);
        }
     }
  });
};

// Preload Video Function
function lazyLoadVidPreLoad(videoID) {
  if (lazyLoadVidDebug == 'true') {
    console.log('%cConfiguring ' + videoID + ' preload for ' + videoID + ' ...', 'color: green;');
  }
  $(videoID).attr('preload', 'none')
  $(videoID).waypoint(function() {
    if (lazyLoadVidDebug == 'true') {
      console.log('%cpreloading ' + videoID, 'color: orange;');
    }
    $(videoID).attr('preload', 'auto')
    this.disable()
    Waypoint.refreshAll()
    }, {
      offset: '300%'
    }
  );
};

// Play Video on Scroll Down Function
function lazyLoadVidPlayDown(videoID) {
  if (lazyLoadVidDebug == 'true') {
    console.log(' • setting lazyLoadVidPlayDown function for ' + videoID + ' ...');
  }
  $(videoID).waypoint(function(direction) {
      if (direction === 'down') {
        if (lazyLoadVidDebug == 'true') {
          console.log('playing down on ' + videoID)
        }
        var vid = $(videoID).get(0)
        vid.play()
      }
      
      }, {
        offset: '100%'
      }
    ); 
};

// Pause Video on Scroll Down Function
function lazyLoadVidPauseDown(videoID) {
  if (lazyLoadVidDebug == 'true') {
    console.log(' • setting lazyLoadVidPauseDown function for ' + videoID + ' ...');
  }
  $(videoID).waypoint(function(direction) {
    if (direction === 'down') {
      if (lazyLoadVidDebug == 'true') {
        console.log('pausing down on ' + videoID)
      }
        var vid = $(videoID).get(0);
        vid.pause()
    }
   
    }, {
      offset: '-100%'
    }
  );
};

// Play Video on Scroll Up Function
function lazyLoadVidPlayUp(videoID) {
  if (lazyLoadVidDebug == 'true') {
    console.log(' • setting lazyLoadVidPlayUp function for ' + videoID + ' ...');
  }
  $(videoID).waypoint(function(direction) {
    if (direction === 'up') {
      if (lazyLoadVidDebug == 'true') {
        console.log('playing up on ' + videoID)
      }
        var vid = $(videoID).get(0)
        vid.play()
    }
    
    }, {
      offset: '-100%'
    }
  );
};

// Pause Video on Scroll Down Function
function lazyLoadVidPauseUp(videoID) {
  if (lazyLoadVidDebug == 'true') {
    console.log(' • setting lazyLoadVidPauseUp function for ' + videoID + ' ...');
  }
  $(videoID).waypoint(function(direction) {
    if (direction === 'up') {
      if (lazyLoadVidDebug == 'true') {
        console.log('pausing down on ' + videoID)
      }
        var vid = $(videoID).get(0)
        vid.pause()
    }
    
    }, {
      offset: '100%'
    }
  );
};

// -----------------------------------------------------------
// lazyLoadVid Configuration
// -----------------------------------------------------------

// Configure Console messages
var lazyLoadVidDebug='false';
if (lazyLoadVidDebug == 'true') {
      console.log(' • jQuery.browser.mobile is ' + jQuery.browser.mobile)
    }

// Configure lazyLoadVid Function Calls
$('video.lazyLoadVid').each(function() {
  var vidID = $(this).attr('id')
  if ( jQuery.browser.mobile ==! 'true' ) {
    lazyLoadVidPreLoad('#' + vidID)
  };
});

$('video.viewportAutoPlay').each(function() {
  var vidID = $(this).attr('id')
  // Only load autoplay if we are not on a mobile device
  if ( jQuery.browser.mobile ==! 'true' )  {
    if (lazyLoadVidDebug == 'true') {
      console.log('%cConfiguring ' + vidID + ' for desktop devices:', 'color: green;');
    }
    lazyLoadVidTogglePlay(vidID)
    lazyLoadVidPlayDown('#' + vidID)
    lazyLoadVidPauseDown('#' + vidID)
    lazyLoadVidPlayUp('#' + vidID)
    lazyLoadVidPauseUp('#' + vidID)
  } else {
    if (lazyLoadVidDebug == 'true') {
      console.log('%cConfiguring ' + vidID + ' for mobile devices:', 'color: green;')
    }
    $(vidID).removeAttr("autoplay")
    if (lazyLoadVidDebug == 'true') {
      console.log(' • Disabling autoplay on mobile devices ...')
    }

    $(vidID).removeAttr("loop")
    if (lazyLoadVidDebug == 'true') {
      console.log(' • Disabling autoplay on mobile devices ...')
    }
  }
  
});

$('video.mobileVideoTogglePlay').each(function() {
  var vidID = $(this).attr('id')
  if (jQuery.browser.mobile ==! 'true') {
    if (lazyLoadVidDebug == 'true') {
      console.log('%c • Remove video controls for desktop devices on ' + vidID, 'color: green;')
    }
    $(this).removeAttr("controls")
    $(this).removeClass("controls-on")

  } else {
    if (lazyLoadVidDebug == 'true') {
      console.log('%cConfiguring ' + vidID + ' for mobile device toggle play', 'color: green;')
    }
    lazyLoadVidTogglePlay(vidID)
  }
});

jquery.waypoints.min.js

/*!
Waypoints - 4.0.0
Copyright © 2011-2015 Caleb Troughton
Licensed under the MIT license.
https://github.com/imakewebthings/waypoints/blob/master/licenses.txt
*/
!function(){"use strict";function t(o){if(!o)throw new Error("No options passed to Waypoint constructor");if(!o.element)throw new Error("No element option passed to Waypoint constructor");if(!o.handler)throw new Error("No handler option passed to Waypoint constructor");this.key="waypoint-"+e,this.options=t.Adapter.extend({},t.defaults,o),this.element=this.options.element,this.adapter=new t.Adapter(this.element),this.callback=o.handler,this.axis=this.options.horizontal?"horizontal":"vertical",this.enabled=this.options.enabled,this.triggerPoint=null,this.group=t.Group.findOrCreate({name:this.options.group,axis:this.axis}),this.context=t.Context.findOrCreateByElement(this.options.context),t.offsetAliases[this.options.offset]&&(this.options.offset=t.offsetAliases[this.options.offset]),this.group.add(this),this.context.add(this),i[this.key]=this,e+=1}var e=0,i={};t.prototype.queueTrigger=function(t){this.group.queueTrigger(this,t)},t.prototype.trigger=function(t){this.enabled&&this.callback&&this.callback.apply(this,t)},t.prototype.destroy=function(){this.context.remove(this),this.group.remove(this),delete i[this.key]},t.prototype.disable=function(){return this.enabled=!1,this},t.prototype.enable=function(){return this.context.refresh(),this.enabled=!0,this},t.prototype.next=function(){return this.group.next(this)},t.prototype.previous=function(){return this.group.previous(this)},t.invokeAll=function(t){var e=[];for(var o in i)e.push(i[o]);for(var n=0,r=e.length;r>n;n++)e[n][t]()},t.destroyAll=function(){t.invokeAll("destroy")},t.disableAll=function(){t.invokeAll("disable")},t.enableAll=function(){t.invokeAll("enable")},t.refreshAll=function(){t.Context.refreshAll()},t.viewportHeight=function(){return window.innerHeight||document.documentElement.clientHeight},t.viewportWidth=function(){return document.documentElement.clientWidth},t.adapters=[],t.defaults={context:window,continuous:!0,enabled:!0,group:"default",horizontal:!1,offset:0},t.offsetAliases={"bottom-in-view":function(){return this.context.innerHeight()-this.adapter.outerHeight()},"right-in-view":function(){return this.context.innerWidth()-this.adapter.outerWidth()}},window.Waypoint=t}(),function(){"use strict";function t(t){window.setTimeout(t,1e3/60)}function e(t){this.element=t,this.Adapter=n.Adapter,this.adapter=new this.Adapter(t),this.key="waypoint-context-"+i,this.didScroll=!1,this.didResize=!1,this.oldScroll={x:this.adapter.scrollLeft(),y:this.adapter.scrollTop()},this.waypoints={vertical:{},horizontal:{}},t.waypointContextKey=this.key,o[t.waypointContextKey]=this,i+=1,this.createThrottledScrollHandler(),this.createThrottledResizeHandler()}var i=0,o={},n=window.Waypoint,r=window.onload;e.prototype.add=function(t){var e=t.options.horizontal?"horizontal":"vertical";this.waypoints[e][t.key]=t,this.refresh()},e.prototype.checkEmpty=function(){var t=this.Adapter.isEmptyObject(this.waypoints.horizontal),e=this.Adapter.isEmptyObject(this.waypoints.vertical);t&&e&&(this.adapter.off(".waypoints"),delete o[this.key])},e.prototype.createThrottledResizeHandler=function(){function t(){e.handleResize(),e.didResize=!1}var e=this;this.adapter.on("resize.waypoints",function(){e.didResize||(e.didResize=!0,n.requestAnimationFrame(t))})},e.prototype.createThrottledScrollHandler=function(){function t(){e.handleScroll(),e.didScroll=!1}var e=this;this.adapter.on("scroll.waypoints",function(){(!e.didScroll||n.isTouch)&&(e.didScroll=!0,n.requestAnimationFrame(t))})},e.prototype.handleResize=function(){n.Context.refreshAll()},e.prototype.handleScroll=function(){var t={},e={horizontal:{newScroll:this.adapter.scrollLeft(),oldScroll:this.oldScroll.x,forward:"right",backward:"left"},vertical:{newScroll:this.adapter.scrollTop(),oldScroll:this.oldScroll.y,forward:"down",backward:"up"}};for(var i in e){var o=e[i],n=o.newScroll>o.oldScroll,r=n?o.forward:o.backward;for(var s in this.waypoints[i]){var a=this.waypoints[i][s],l=o.oldScroll<a.triggerPoint,h=o.newScroll>=a.triggerPoint,p=l&&h,u=!l&&!h;(p||u)&&(a.queueTrigger(r),t[a.group.id]=a.group)}}for(var c in t)t[c].flushTriggers();this.oldScroll={x:e.horizontal.newScroll,y:e.vertical.newScroll}},e.prototype.innerHeight=function(){return this.element==this.element.window?n.viewportHeight():this.adapter.innerHeight()},e.prototype.remove=function(t){delete this.waypoints[t.axis][t.key],this.checkEmpty()},e.prototype.innerWidth=function(){return this.element==this.element.window?n.viewportWidth():this.adapter.innerWidth()},e.prototype.destroy=function(){var t=[];for(var e in this.waypoints)for(var i in this.waypoints[e])t.push(this.waypoints[e][i]);for(var o=0,n=t.length;n>o;o++)t[o].destroy()},e.prototype.refresh=function(){var t,e=this.element==this.element.window,i=e?void 0:this.adapter.offset(),o={};this.handleScroll(),t={horizontal:{contextOffset:e?0:i.left,contextScroll:e?0:this.oldScroll.x,contextDimension:this.innerWidth(),oldScroll:this.oldScroll.x,forward:"right",backward:"left",offsetProp:"left"},vertical:{contextOffset:e?0:i.top,contextScroll:e?0:this.oldScroll.y,contextDimension:this.innerHeight(),oldScroll:this.oldScroll.y,forward:"down",backward:"up",offsetProp:"top"}};for(var r in t){var s=t[r];for(var a in this.waypoints[r]){var l,h,p,u,c,d=this.waypoints[r][a],f=d.options.offset,w=d.triggerPoint,y=0,g=null==w;d.element!==d.element.window&&(y=d.adapter.offset()[s.offsetProp]),"function"==typeof f?f=f.apply(d):"string"==typeof f&&(f=parseFloat(f),d.options.offset.indexOf("%")>-1&&(f=Math.ceil(s.contextDimension*f/100))),l=s.contextScroll-s.contextOffset,d.triggerPoint=y+l-f,h=w<s.oldScroll,p=d.triggerPoint>=s.oldScroll,u=h&&p,c=!h&&!p,!g&&u?(d.queueTrigger(s.backward),o[d.group.id]=d.group):!g&&c?(d.queueTrigger(s.forward),o[d.group.id]=d.group):g&&s.oldScroll>=d.triggerPoint&&(d.queueTrigger(s.forward),o[d.group.id]=d.group)}}return n.requestAnimationFrame(function(){for(var t in o)o[t].flushTriggers()}),this},e.findOrCreateByElement=function(t){return e.findByElement(t)||new e(t)},e.refreshAll=function(){for(var t in o)o[t].refresh()},e.findByElement=function(t){return o[t.waypointContextKey]},window.onload=function(){r&&r(),e.refreshAll()},n.requestAnimationFrame=function(e){var i=window.requestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||t;i.call(window,e)},n.Context=e}(),function(){"use strict";function t(t,e){return t.triggerPoint-e.triggerPoint}function e(t,e){return e.triggerPoint-t.triggerPoint}function i(t){this.name=t.name,this.axis=t.axis,this.id=this.name+"-"+this.axis,this.waypoints=[],this.clearTriggerQueues(),o[this.axis][this.name]=this}var o={vertical:{},horizontal:{}},n=window.Waypoint;i.prototype.add=function(t){this.waypoints.push(t)},i.prototype.clearTriggerQueues=function(){this.triggerQueues={up:[],down:[],left:[],right:[]}},i.prototype.flushTriggers=function(){for(var i in this.triggerQueues){var o=this.triggerQueues[i],n="up"===i||"left"===i;o.sort(n?e:t);for(var r=0,s=o.length;s>r;r+=1){var a=o[r];(a.options.continuous||r===o.length-1)&&a.trigger([i])}}this.clearTriggerQueues()},i.prototype.next=function(e){this.waypoints.sort(t);var i=n.Adapter.inArray(e,this.waypoints),o=i===this.waypoints.length-1;return o?null:this.waypoints[i+1]},i.prototype.previous=function(e){this.waypoints.sort(t);var i=n.Adapter.inArray(e,this.waypoints);return i?this.waypoints[i-1]:null},i.prototype.queueTrigger=function(t,e){this.triggerQueues[e].push(t)},i.prototype.remove=function(t){var e=n.Adapter.inArray(t,this.waypoints);e>-1&&this.waypoints.splice(e,1)},i.prototype.first=function(){return this.waypoints[0]},i.prototype.last=function(){return this.waypoints[this.waypoints.length-1]},i.findOrCreate=function(t){return o[t.axis][t.name]||new i(t)},n.Group=i}(),function(){"use strict";function t(t){this.$element=e(t)}var e=window.jQuery,i=window.Waypoint;e.each(["innerHeight","innerWidth","off","offset","on","outerHeight","outerWidth","scrollLeft","scrollTop"],function(e,i){t.prototype[i]=function(){var t=Array.prototype.slice.call(arguments);return this.$element[i].apply(this.$element,t)}}),e.each(["extend","inArray","isEmptyObject"],function(i,o){t[o]=e[o]}),i.adapters.push({name:"jquery",Adapter:t}),i.Adapter=t}(),function(){"use strict";function t(t){return function(){var i=[],o=arguments[0];return t.isFunction(arguments[0])&&(o=t.extend({},arguments[1]),o.handler=arguments[0]),this.each(function(){var n=t.extend({},o,{element:this});"string"==typeof n.context&&(n.context=t(this).closest(n.context)[0]),i.push(new e(n))}),i}}var e=window.Waypoint;window.jQuery&&(window.jQuery.fn.waypoint=t(window.jQuery)),window.Zepto&&(window.Zepto.fn.waypoint=t(window.Zepto))}();

Lazy Load Image and Video

JQuery Lazy Load Image
--------------------------------------------------------------
jquery.lazyLoadImg - 1.1.3
Copyright © 2016 Kevin Garcia, Stanford University
Released under the The MIT License (MIT)
Requires jquery.waypoints
--------------------------------------------------------------

Jquery Lazy Load Video
--------------------------------------------------------------
jquery.lazyLoadVid - 0.1.1
Copyright © 2016 Kevin Garcia, Stanford University
Released under the The MIT License (MIT)
Requires jquery.waypoints
--------------------------------------------------------------

MIT License

The MIT License (MIT)
Copyright (c) 2016 Kevin Garcia, Stanford University.

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.