Elements:Video Blocks
Grab attention with these stunning video background blocks.
Setup
Add background video to any
div
by adding an
data-bg-video="PATH-TO-VIDEO"
attribute to a
div
element. You can pass optional settings via a
data-settings='{JS-OBJECT}'
attribute as well.
Examples
Video Background Rule!
wow wow wow this is nice!
Video Background Rule!
Video Background Rule!
Get Bubbles!Options
Options can be passed by adding a
data-settings="{OBJECT}"
attribute.
Example:
data-settings='{"position":"50% 50%", "autoplay":false}'
volume
Default:
1
Video volume setting.
playbackRate
Default:
1
Video playback rate/speed.
muted
Default:
true
Whether the video should be muted.
loop
Default:
true
Whether the video should loop.
autplay
Default:
true
Whether the video should autoplay on load.
muted
Default:
'50% 50%'
Position the video, similar to the CSS background-position property.
posterType
Default:
'detect'
Poster image type. "detect" - auto-detection; "none" - no poster; "jpg", "png", "gif",... - extensions.
resizing
Default:
true
Autoresize video to fit.
bgColor
Default:
'transparent'
Set the background colour behind the video.