Video background on Category Page

This nice enhancement is based on the Humble Squid theme.

See live example at:

https://moderatortal.zendesk.com/hc/en-us

This enhancement is based on the VideoBG plugin by Syd Lawrence:
http://syddev.com/jquery.videoBG/

To make it work, you will need:

Video files in multiple formats (webm, mp3, ogv).
Poster image - which should be the 1st frame of the video.
The plugin file (jquery.videoBG.js) from the site above.

Steps:

1. Add the video files, poster image, and .js file as assets to your theme.

2. Add the following script to the Document head page 

<script src="{{asset 'jquery.videoBG.js'}}"/>

3. Add the following script to the Category page:

<script>
$(document).ready(function(){
$('.section-tree').css('min-height','500px')
$('.section-tree').css('background-color','rgba(0,0,0,0)')
$('div.section-tree').videoBG({
webm: '{{asset '720.webm'}}',
mp4: '{{asset '720.mp4'}}',
poster: '{{asset 'category_video_poster.png'}}',
scale: true,
autoplay: true,
loop: true,
zIndex: 0
});
})
</script>

Replace the asset names as needed.