sam
sam

Reputation: 1087

Find a div in Flexslider after callback

I'm using Flexslider. On completing each slide, I want to find the content of a div .extra. I'm trying to use the after callback function of Flexslider to find the content of the div, but it does not find. It does not even find any parent or any other element class.

How can I find the content of .extra div on completing each slide?

HTML:

<div class="box">
    <div class="extra">abc</div>
    <div class="flexslider">
      <ul class="slides">
        <li><img src="image1.jpg" /></li>
        <li><img src="image2.jpg" /></li>
        <li><img src="image3.jpg" /></li>    
      </ul>
    </div>
</div>

JS:

$('.flexslider').flexslider({
    animation: "slide",
    after: function(slider) {
        var abc = $(this).parents().find('.extra').html();
        alert(abc);
    }
});

Demo: http://jsfiddle.net/he8gfh29/

Upvotes: 1

Views: 671

Answers (1)

Arsh Multani
Arsh Multani

Reputation: 1591

The below code will work for you :) as the slider's selector is being passed through function(slider) you need to use slider object at the place of $(this).

$('.flexslider').flexslider({
    animation: "slide",
    after: function(slider) {
        var abc = slider.parents().find('.extra').html();
        alert(abc);
    }
  });

Upvotes: 1

Related Questions