CODEWITHSUNDEEP
jquerybxslider
Karl
Karl

Reputation: 5473

bxSlider jQuery get current slide

The Problem

I'm using bxSlider as a carousel for a "team" page, where 3 team members are shown. However, bxSlider treats the image on the far left as the current active slide, not the one in the center.

What I've tried

  onSlideBefore: function (currentSlideNumber, totalSlideQty, currentSlideHtmlObject) {
    $('.team-slider div').removeClass('active');
    $('.team-slider div').eq(currentSlideHtmlObject).addClass('active')
    var current = $('.team-slider div.active img').attr('id');
    $('#team-member').load('load_member.php?id='+current); 
  }

Because of the way bxSlider works, it's not choosing the center image as the current active slide, thus the data being pulled in is incorrect. In order to get it to work correctly my plan was to add an id to the img, then using the currentSlideNumber, grab that id and use it to load the content, but I haven't had much luck with this.

Upvotes: 0

Views: 8127

Answers (1)

Karl
Karl

Reputation: 5473

Well more fool me, I've managed to do it minutes after posting here.

Apologies for that, the working code is below for anyone else who stumbles upon this issue.

onSlideBefore: function (currentSlideNumber, totalSlideQty, currentSlideHtmlObject) {
    $('.team-slider div').removeClass('active');
    $('.team-slider div').eq(currentSlideHtmlObject+1).addClass('active')
    var current = $('.team-slider div.active img').attr('id');
    $('#team-member').load('load_member.php?id='+current); 
  }

Upvotes: 1

Related Questions