How to use BigVideo.js inside of a div?

You need to specify correctly the container of the BigVideo object (I'm not sure if it was a typo but everything seems ok)

ID

BV = new $.BigVideo({container: $('#video-wrap')});

Class

BV = new $.BigVideo({container: $('.video-wrap')});

In the creation of the object it sets to default the body (BigVideo Code):

var defaults = {            // If you want to use a single mp4 source, set as true            useFlashForFirefox:true,            // If you are doing a playlist, the video won't play the first time            // on a touchscreen unless the play event is attached to a user click            forceAutoplay:false,            controls:false,            doLoop:false,            container:$('body'), //Container            shrinkable:false        };

Then the options that you send are merged using $.extend()

var settings = $.extend({}, defaults, options);

The answer above is only partially answering the question. You should change or override the CSS for '#big-video-wrap' in bigvideo.css. Change fixed to absolute and the video will be only visible in it's container.

From

#big-video-wrap {  overflow: hidden;  position: fixed;  height: 100%;  width: 100%;  top: 0;  left: 0;}

To

#big-video-wrap {  overflow: hidden;  position: absolute;  height: 100%;  width: 100%;  top: 0;  left: 0;}