Video Backgrounds
These modular elements can be readily used and customized across pages and in different blocks.
Explore all of Stack’s modular elements
at the Element Index Page →
Local Video Background
This section uses local video files hosted on your own server, required in WEBM, MP4 and OGV formats using the HTML video element. Place the class .videobg and .imagebg on the section as described below.
NOTE: The video background element does not display on mobile devices, for these devices, a fallback poster image is used.
Here’s a local video being used as a background
Youtube Video Background
This section uses a video hosted on Youtube. The Youtube background sections requires a div with class .youtube-background with the data attribute data-video-url which is the Youtube video’s ID.
Alternative, add the data-start-at attribute with a numerical value to start the video playing from a particular point ie. a value of 10 would start the video 10 seconds in.
Place the class .videobg and .imagebg on the section as described below.
NOTE: The Youtube video background element does not display on mobile devices, for these devices, a fallback poster image is used.