Twitter Bootstrap Carousel IE Issues

Question

I currently have a carousel using Twitter's bootstrap on my website. I'm controlling which divs to slide in based off this javascript, which works perfect in Chrome, Safari, FF, etc. But I'm having issues with it in IE 9 and lower.

<script type="text/javascript">


$('.carbtn').click(function(q){
    q.preventDefault();
    targetSlide = $(this).attr('data-to')-1;
    $('#myCarousel').carousel(targetSlide);
});

</script>

The buttons to control the carousel look like this,

<div class="carbtn" data-to="2">Learn More</div>

In IE, only the first click is registered. Rather than sliding in, the new div just shows up. Any other clicks on .carbtn buttons don't change anything. Is there a fix to get this to work in IE?

Answer 1

As Jako said in his comment, adding the slide class to the carousel div seems to fix this problem.

<div id="myCarousel" class="carousel slide">

So before 2.1, including 'slide' is required for IE8 to run.
After 2.1, including 'slide' will allow IE8 to have slide effect. But without 'slide' it will still work, just without transition.