Skip to content
Go to file

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time

NOTE I have not been contributing to this, I'm happy to give you permissions to write to the repo if I am slowing you down.

jQuery.BackgroundVideo V1.0.5

Inspired by [Tubular] (

Example: 360 Video Example:

Production Example: [] (

jQuery plugin that lets you create background videos using youtube api

Put the script at the bottom of your markup right after jQuery:

 <script src=""></script>
 <script src="src/jquery.youtubebackground.js"></script>
<div id="video"></div>

Call the plugin function and your carousel is ready.

    fitToBackground: true,
    videoId: 'LSmgKRx5pBo'

Need to customize some CSS in order to make it a background

 position: relative;
 background: transparent;

 position: absolute;
 top: 0;
 z-index: -1;

Works with Youtube Javascript API

Youtube Javascript API Options

Any youtube option must be placed within the playerVars object.

    fitToBackground: true,
    videoId: 'LSmgKRx5pBo',
    playerVars: {
      modestbranding: 0,
      autoplay: 1,
      controls: 1,
      showinfo: 0,
      branding: 0,
      rel: 0,
      autohide: 0,
      start: 59

Access all of YouTube's API events and methods by using player:

var player = $('#background-video').data('ytPlayer').player;

player.addEventListener('onStateChange', function(data){
  console.log("Player State Change", data);


For more details visit our [Documentations Page] (

Install with Bower

bower install youtube-background-video


[Documentations Page] (


I welcome contributors, bugs, and questions.

Bug reports

A bug is a demonstrable problem that is caused by the code in the repository. Good bug reports are extremely helpful, so thanks!

Guidelines for bug reports:

  1. Use the GitHub issue search — check if the issue has already been reported.

  2. Check if the issue has been fixed — try to reproduce it using the latest develop branch in the repository.

  3. Isolate the problem — ideally create a reduced test case and a live example. This JSFiddle is a helpful template you can fork.

By submitting a patch, you agree to allow the project owner to license your work under the terms of the MIT License.


The code and the documentation are released under the MIT License.


A wrapper for the Youtube API - Great for fullscreen background videos or just regular videos.



No packages published