Callback API

JS:
$('.bxslider').bxSlider({
  onSliderLoad: function(){
    // do funky JS stuff here
    alert('Slider has finished loading. Click OK to continue!');
  },
  onSlideAfter: function(){
    // do mind-blowing JS stuff here
    alert('A slide has finished transitioning. Bravo. Click OK to continue!');
  }
});
HTML:
<div class="bxslider">
  <div><img src="http://placehold.it/900x200&text=Slide 1" /></div>
  <div><img src="http://placehold.it/900x200&text=Slide 2" /></div>
  <div><img src="http://placehold.it/900x200&text=Slide 3" /></div>
</div>

Examples

  1. Image gallery with captions
  2. Auto show with start / stop controls
  3. Manual show without infinite loop
  4. Slidehow using adaptiveHeight
  5. Carousels demystified - in depth explanation with examples
  6. Carousel - static number of slides showing
  7. Carousel - dynamic number of slides showing
  8. Thumbnail pager - method 1
  9. Thumbnail pager - method 2
  10. Vertical slideshow
  11. Custom next / prev control selectors
  12. Multiple slideshows
  13. Callback API
  14. Public methods
  15. Ticker
Coded with ♥ by
Steven Wanderski Chicago Web Developer