Making BXslider full screen (filling entire browser window)

Question

I am currently trying to implement THIS very simple content slider. I have reached a point where it is working, however using the CSS code below I need to make the slider fu

Answer 1

Here you are a full screen bxSlider + responsive. http://jsfiddle.net/0nj2ry4n/1/

First remove the images and make them background of the li elements.

Then add this css

*{
    margin: 0px;
    padding: 0px;
}
body, html{
    height: 100%;
}
.bx-viewport, .bx-wrapper{
    position:relative;
    width:100%;
    height:100% !important;
    top:0;
    left:0;
}
.bxslider, .bxslider li{
    height: 100% !important;;
}
.bxslider li{
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
}
.bx-wrapper .bx-viewport{
    border: none !important;
}

And call bxSlider

$(document).ready(function(){
    $('.bxslider').bxSlider({
        pager: false
    });
});