BxSlider displayes last slide as first slide

Question

I have created 4 sliders. Initially all 4 are hidden (display:none) so I have used this code to display the relevant slider on click of its respective category.

The slid

Answer 1

I was having this problem too just recently. The solution is you have to put the instance of BxSlider on $(window).load() event not in $(window).ready() here's a sample.

$(window).load(function(){
            $('.bxslider').bxSlider({
                pagerCustom: '#bx-pager',
                randomStart: false,
                controls: true,
                auto: true
            });    
        });

It is important to note that the problem starts to persist once you have at least 7 slides.