Posted by April Sadowski and filed under Blog, Tips & Tricks

So I really love how this Carousel (Carousel Extended by msurguy) works over at Bootsnipp. The bad thing is, the code is outdated. It’s Bootstrap 2.3.2 and we’re at 3.2 now. Plenty of people, however, wanted an updated version. It really was an excellent carousel.

The first thing was to adjust the HTML code. I changed out the span scaffolding for the grid columns.

I included the BS 3 carousel controls with the glyphicons.

<a class="carousel-control left" href="#myCarousel" data-slide="prev">‹</a>
<a class="carousel-control right" href="#myCarousel" data-slide="next">›</a>

Became

<a class="left carousel-control" href="#myCarousel" data-slide="prev">

</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">

</a>

The next was to simplify the output of the thumbnails and update the responsive utilities.

<div id="slider-thumbs" class="row hidden-phone">
<div class="span12"><!-- Bottom switcher of slider -->
<ul class="thumbnails">
    <li class="span2">```Became