Custom Vimeo Video Background Plugin with jQuery - Vimeofy

Vimeofy is a simple, lightweight jQuery plugin which uses a Vimeo video as the background of any container element.

See also:

• Fullscreen Background Video Plugin For jQuery - BigVideo
• jQuery Plugin For Fullscreen Vimeo Video Background - Vimelar
• Simplest Youtube Video Background Plugin For jQuery - rsBackVid
• Fullscreen Youtube Video Background Plugin with jQuery
• Simple Youtube Video Background Plugin For jQuery - bigYouTube
• jQuery Plugin For Fullscreen YouTube Video Backgrounds - tubular
• Awesome Video Background Plugin with HTML5 and Youtube API - YTPlayer

How to use it:

1. First you need to load the jQuery vimeofy plugin after you've loaded jQuery library.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="scripts/vimeofy.js"></script>

2. Call the function on the target container and specify a Vimeo video for the background.

$( '#background' ).vimeofy({
  'url': 'https://vimeo.com/122622147'
});

3. Add a background image to the container that will be severed as a fallback for the Vimeo video.

#background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url( 'poster.jpg' );
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  overflow: hidden;
  z-index: -10;
}

4. All available settings.

$( '#background' ).vimeofy({
  'url': 'https://vimeo.com/122622147',
  'color': '#00D8D8',
  'autoplay': true,
  'loop': true,
  'delay': 5000,
});

---

This awesome jQuery plugin is developed by FlipFlopInteractive. For more Advanced Usages, please check the demo page or visit the official website.