CODEWITHSUNDEEP
jqueryhtmlcss
Harsha M V
Harsha M V

Reputation: 54949

jQuery Slider to stretch full Width Height

I am trying to implement Nerve slider where i want to stretch across the width of the browser and the height. I have even specified a fixed width for the Div still the Plugin seems to re-size it.

Any idea how i can force the height and the width to the full size of the temporary background image.

http://play.mink7.com/sophiance/

.homeSlider {
    width: 100%;
    height: 990px;
    position: absolute;
}
.homeSlider > #slider {
    width: 100%;
    height: 990px !important;
    background-image:100%;
}

**Edit**

Changing the Height and width to 100% did the job. When i Resize the browser i get a white space in that section. Any way i can make the slider fit in that section but the height should not be resized.

Upvotes: 2

Views: 3693

Answers (2)

BenEgan1991
BenEgan1991

Reputation: 637

There is an option when using the Nerve slider to set the slider to fullscreen.

$.fn.nerveSlider = function(userOptions) {
        var options = $.extend({
            sliderWidth: "1200px",
            sliderHeight: "500px",
            sliderHeightAdaptable: false,
            sliderFullscreen: false,

Just set this line to true:

sliderFullscreen: true,

Should do the trick.

Upvotes: 0

Nick R
Nick R

Reputation: 7784

This is the start of the default settings in the non-minified version of the plugin:

$.fn.startslider = function (userOptions) {
    var options = $.extend({
        sliderWidth: "1200px",
        sliderHeight: "500px",

When you initialise the slider on your page, you need to override these values.

Edit:

As mentioned by Michael, you can do:

    sliderWidth: $(window).width() +"px",
    sliderHeight: $(window).height()+"px"

Upvotes: 6

Related Questions