Carousel animation order with a hover event.

Hello! I made a carousel using example code, and I added handler for the mouse hover event. $("#carousel-example-generic .carousel-indicators li").hover(function(){ var goto = Number( $(this).attr('data-slide-to') ); $("#carousel-example-generic").carousel(goto);<br /> }); But when the cursor passes over a number of indicators, the animation is triggered for every one. And it starts for each one only when it ends for previous one. I need animation to start without waiting for the end of the previous one. Here is my example: http://idearoom.medobzor.kz/kitchens/

And what I need to get: http://www.dica.es/en/kitchen/

How can I do that? Thank you in advance! And sorry for my bad english :)

From everything that I've tried, I think that the default carousel component isn't going to behave that way or at least I haven't figured out a way to do it.

The site that you are comparing to uses the following jQuery plugin name Cycle2 http://jquery.malsup.com/cycle2/

Now I'm not sure but I think they are using some variation of one of these example demos http://jquery.malsup.com/cycle2/demo/pager.php

Saj