woocommerce / FlexSlider

An awesome, fully responsive jQuery slider plugin
http://www.woocommerce.com/flexslider/
GNU General Public License v2.0
4.91k stars 1.69k forks source link

Flexslider > Next slide white space issue #1701

Closed thedappernisarg closed 2 months ago

thedappernisarg commented 6 years ago

Hi I am implementing two rows slider using flexslider. Two rows are working using following code. while, got to next slide, I can see the white space. Is it issue with Width or other? It's working well with one row. I am slighly confused. Why am I getting the white space in next slide ?

Thank You

function make2Rows(iWidth) {
                var iHeight = parseFloat($('.destination-slider .slides > li').height());
                $('.destination-slider .slides > li').css('width', iWidth+'px');
                $('.destination-slider .slides > li:nth-child(even)').css('margin', iHeight / 2.5 +'px 0px 0px -'+iWidth+'px');
            }

            $(window).load(function() {
                 var itemCnt = 3; // this will be the number of columns per row
                 var iWidth = parseFloat($('.destination-slider').width() / itemCnt);    
                $('.destination-slider').flexslider({
                    animation: "slide",
                    animationLoop: true,
                    itemMargin: 0,      
                    slideshow: false,
                    reverse: false,
                    touch: true,
                    controlNav: false,
                    itemWidth: iWidth,
                    start: make2Rows(iWidth)
                });