real quick background video js class

video-hero.js

function Video_Hero(opts) {
  this.$container = opts.$container;
  this.videoClasses = opts.videoClasses;
  this.basePath = opts.basePath;
  this.baseFileName = this.$container.data('base-filename');
}

Video_Hero.prototype.fullPath = function (ext) {
  return [this.basePath, this.baseFileName, ext].join('');
};

Video_Hero.prototype.renderVideo = function () {
  //set up our video dom snippet
  var $vid = $(
    '<video />',
    {
      autoplay:true,
      loop:true,
      poster: this.fullPath('.gif'),
      id: 'video_hero--video',
      'background-image': 'url(' + this.fullPath('.gif') + ')',
      class: this.videoClasses
    }
  )
    .append('<source type="video/mp4" src="'+this.fullPath('.mp4')+'"/>')
    .append('<source type="video/webm" src="'+this.fullPath('.webm')+'"/>')
    .append('<source type="video/ogv" src="'+this.fullPath('.ogv')+'"/>');
  this.$container.prepend($vid)
};

Video_Hero.prototype.init = function () {
  if (this.initted) return;
  this.initted = true;

  this.renderVideo();
};
$(function() {
  if ($('.video_hero-do_render').length > 0) {
    $('.video_hero-do_render').each(function(i) {
      var $container = $(this);
      var hero = new Video_Hero({$container:$container, videoClasses: 'video_hero--video masthead--bg_video'})
      hero.init();
    });
  }
});