Slide two carousel sliders at a same time in Bootstrap

To avoid this delay, you could manually launch both carousels at the same time, and use customized treatments for events.

• Syncronized init
• Simple launch events on both carousels
• Pause on hover (I missed you didn't need it)

$('.carousel-sync').carousel('cycle');
$('.carousel-sync').on('click', '.carousel-control[data-slide]', function (ev) {
    ev.preventDefault();
    $('.carousel-sync').carousel($(this).data('slide'));
});
$('.carousel-sync').on('mouseover', function(ev) {
    ev.preventDefault();
    $('.carousel-sync').carousel('pause');
});
$('.carousel-sync').on('mouseleave', function(ev) {
    ev.preventDefault();
    $('.carousel-sync').carousel('cycle');
});

Browse More Articles

Tweet

Written by KiranBloger

Experienced Webdesigner and SEO Consultant Specialist from Cochin, Kerala with over three years of experience in the field of Search Engine Optimization, SEO and Internet Marketing