Vide makes video backgrounds as easy as saying “jQuery.”

The plugin works with all modern desktop browsers, including Internet Explorer 9+. There is limited functionality for iOS and Android devices. Video works with iOS only in the native player; Android features are a little more unpredictable. Fullscreen poster mode is the default for each of these environments.

To use Vide just install using Bower and include the plugin. Include a video file using a common format such as “.webm” or “mp4” and create a still (poster) image file as a .jpg, .png or .gif.

Configure the correct path and options and you’re ready to go. The Vide plugin will resize automatically based on window size, although you have to option to disable this function.

Vide has a few other code specifications as well that are important to pay attention to during setup. You can find all the details and instructions in the plugin documentation.

Create colorful triangle meshes with SVG images and CSS backgrounds for any website design. The Trianglify plugin uses an algorithm to create beautiful triangle backgrounds so that you don’t have to pull your hair out trying to imagine a randomized design.

And you have complete control over the final rendering using a few simple tools. (You can download and install using NPM, Bower or CDNJS or try the Triangle Generator if you are concerned about the code.)

Start with the variance tool to determine the amount of randomness in the pattern. Then set a cell parameter to show how large or small each triangle can appear. Finally pick a color combination that works with your website hues. The plugin comes with a large number of preset options from the colorbrewer palette set that are ready to use. The colors range from monotone palettes to contrasting sets of color.

The final pattern can be output in canvas, SVG or PNG formats for ease of use no matter what your project type. And if you are still not quite satisfied, there are a few extra options as well in the code that you can adjust — such as background size, strokes, variance in triangle sizes in relation to one another and x and y color patterns.

CoverVid is a great little tool that allows your HTML5 video behave like a background cover image.

This tool is different because it is lightweight — coming in at only 800 bytes — and is usable in native Javascript and jQuery. Its logic is parent based, meaning the parent element can be any size (not necessarily just a full-screen background).

Here’s how it works:

• Pull the project down from GitHub and link covervid.min.js into your site. Make sure it is loaded after jQuery.
• It is important to note that the video you target will use its parent element to scale. With that in mind, there’s some simple markup and base styling to size the video’s parent/wrapper element.
• Call the plugin and you are ready to go.

What’s especially nice about CoverVid is that this tool allows you to create a trendy video-based homepage with ease. You can add this tool to your existing site and get a trendy design refresh in no time. The hardest part will be finding the perfect video to represent your website or brand page.

jQuery tubular is a plugin that places a YouTube video of your choice into your page as a background.

Makes it easy to add fit-to-fill background video to websites.

Allows you to add a large image (or a set of images) to the background of your web page and will proportionally resize the image(s) to fill the entire window area.

Parallax has never been easier.

Allows you to add a dynamically-resized background image to any page or block level element.

Allows you to add a dynamically-resized background image to any page.

Supersized is a fullscreen background slideshow built using the jQuery library.

This plugin create a moving background image for your page.

Turns a selected element into a ‘window’, or viewport, and all its children into absolutely positioned layers that can be seen through the viewport.