adjust jssor slider in a container div

Question

I have 3 divs the first is headed "DivHeader", the second "DivMenu" is a menu and is left and the third is the content "DivContent" where the sliders are being. I have a problem with the div "DivContent" since the sliders do not fit the size of the div "DivContent". How can I do?

Answer 1

Please use the following code to scale your slider to fit width of your 'DivContent'.

        var jssor_slider1 = new $JssorSlider$(...;
        //responsive code begin
        //you can remove responsive code if you don't want the slider scales while window resizes
        function ScaleSlider() {
            var parentWidth = jssor_slider1.$Elmt.parentNode.clientWidth;
            if (parentWidth)
                jssor_slider1.$ScaleWidth(parentWidth);
            else
                window.setTimeout(ScaleSlider, 30);
        }

        ScaleSlider();

        if (!navigator.userAgent.match(/(iPhone|iPod|iPad|BlackBerry|IEMobile)/)) {
            $(window).bind('resize', ScaleSlider);
        }


        //if (navigator.userAgent.match(/(iPhone|iPod|iPad)/)) {
        //    $(window).bind("orientationchange", ScaleSlider);
        //}
        //responsive code end