html5 视频 100% 宽度和高度通过 javascript

Question

How can I achieve something like this http://themenectar.com/demo/salient-agency/ ?

Basically it is a responsive video that fit whole dimension of the screen. I tried but without success, my problem is that the video doesn't fit the whole screen size (like the reference website)

I saw that site and I think I have to use javascript to give the dimensions

this is my test on codepen http://codepen.io/mp1985/pen/YyawvO

jQuery(document).ready(function($) {
      function setHeight() {
        windowHeight = $(window).innerHeight();
        windowWidth = $(window).innerWidth();

        $('.video-wrap, video').css('height', windowHeight);
        $('.video-wrap, video').css('width', windowWidth);

      }

      setHeight();

      $(window).resize(function() {
        setHeight();
      });
    });

Many thanks

Answer 1

You can use one of this plugins

http://dfcb.github.io/BigVideo.js/

http://vodkabears.github.io/vide/

https://github.com/matthojo/videojs-Background

If you don't have previous experience working with plugins just remember to include jquery script before plugin script