Image gallery with captions

JS:
  $(function(){
    $('.bxslider').bxSlider({
      mode: 'fade',
      captions: true,
      slideWidth: 600
    });
  });
HTML:
<div class="bxslider">
  <div><img src="/assets/coffee1-7325690f507d48962d312be15d9d8929be4a5ff04d184d5ed0a96c1b27940260.jpg" title="Coffee 1" /></div>
  <div><img src="/assets/coffee2-8bb17517b21cc5b38f3ea7d14cfc4b4c82cc51b99e82bfc3a6d02688ab6c5988.jpg" title="Coffee 2" /></div>
  <div><img src="/assets/coffee3-02c76c3b922183d7c5144e6856065ad68834ddc7ab5367481a225c516a308cb8.jpg" title="Coffee 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