Old post I know, but I wanted to show both slide and slid using the .on function.
So, my 2 cents...
JSFiddle
$('#myCarousel').on('slide.bs.carousel', function (e) {
$( '.carousel' ).removeClass('color-start');
$( '.carousel' ).addClass('color-finish');
$('#bind').html('Sliding!');
});
$('#myCarousel').on('slid.bs.carousel', function (e) {
$( '.carousel' ).removeClass('color-finish');
$( '.carousel' ).addClass('color-start');
$('#bind').html('slid again!');
});
The 'addClass & removeClass' are for the fun of showing something is happening and when. Also, you could use this along with animate.css to add/remove the 'animated' class to elements .on(slide,).
$('#bind').html('Sliding!')
The above is I don't like 'alerts' and showing console.log can be a pain on smaller screens.