Skip to content

Instantly share code, notes, and snippets.

@jlazanowski

jlazanowski/gist:6302508

Created August 22, 2013 02:21
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save jlazanowski/6302508 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save jlazanowski/6302508 to your computer and use it in GitHub Desktop.
Download ZIP
Carousel Swipe support with multiple sliders
Raw
gistfile1.txt
<script>
$(document).ready(function() {
//add your other targets here
$("#myCarousel, #myOtherCarousel").swiperight(function() {
$(this).carousel('prev');
});
//add your other targets here
$("#myCarousel, #myOtherCarousel").swipeleft(function() {
$(this).carousel('next');
});
});
</script>
@wkw
Copy link

wkw commented Sep 2, 2013

Thanks for the writeup on your blog. It got me what I needed with minimal effort.

If you use Bootstrap 3's .carousel class, you can handle swipe support for all carousels with a simplified selector

<script type='text/javascript'>
/* <![CDATA[ */
(function($){
    // on ready
    $(function(){
        $(".carousel").swiperight(function() {
            $(this).carousel('prev');
        })
        .swipeleft(function() {
            $(this).carousel('next');
        });
    });
})(jQuery);
/* ]]> */
</script>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment