-1

I have a slider of 40 slides with 13 current slides visible. I want to jump to a certain slide on page load. For example: page1 - load slide 1 first / page25 - load slide 25 first. Thanks All.

Thats my solution:

    // calculate starting slider
    var hActive = $('.h-active');
    var hIndex = hActive.index();
    var startingSlider;
    if (hIndex <= 12) {
        startingSlider = 0;
    } else if (hIndex >= 13 && hIndex <= 25) {
        startingSlider = 1;
    } else if (hIndex >= 26 && hIndex <= 38) {
        startingSlider = 2;
    } else {
        startingSlider = 3;
    }
    // h-slider animation
    $('.h-slide').mouseover(function() {
        $(this).addClass('h-active');
        $(this).siblings().removeClass('h-active');
    });
    $('.h-slide').mouseleave(function() {
        $(this).removeClass('h-active');
        hActive.addClass('h-active');
    });
    // h-slider call
    $('.h-slider').bxSlider({
        pager: false,
        controls: true,
        minSlides: 13,
        maxSlides: 13,
        slideWidth: 80,
        nextSelector: '#h-next',
        prevSelector: '#h-prev',
        nextText: '<i class="h-next"></i>',
        prevText: '<i class="h-prev"></i>',
        speed: 1000,
        infiniteLoop: false,
        startSlide: startingSlider
    });
givehug
  • 1,863
  • 1
  • 14
  • 19

2 Answers2

1
var bx = $(".bxslider").bxSlider({
   startSlide: 24
});
zer00ne
  • 41,936
  • 6
  • 41
  • 68
1

Please see the options page on bxslider site.

the documentation states that we can pass the starting slide number when initialising

startSlide

Starting slide index (zero-based)

default: 0 options: integer

Since you have not mentioned any programming language here,I am assuming you can get the page number in JS variable like pagenum which can be assigned a value before bxslider in initialization like below:

var pagenum;
//set pagenum here
$('.bxslider').bxSlider({
  startSlide: pagenum?pagenum:0;
  captions: true
});
Community
  • 1
  • 1
DhruvJoshi
  • 17,041
  • 6
  • 41
  • 60