Reputation: 1087
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
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