JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<div class="container">
<!-- MARKETING LINE-->
		<div class="row-fluid">
			<div class="well">
				<div class="row-fluid">
					<div class="span8">
						<p class="lead ">
			
                          Bootstrap 3 Upgrader: Get your HTML from 2.3 to 3.0! Free Bootstrap 2 =&gt; 3 migration service now alive! 
						</p>
					</div>
					<div class="span4">
						<a class="btn btn-large btn-danger btn-block" href="http://bootstrap3.kissr.com/" target="_blank"> Start upgrade →</a>

					</div>
					
				</div>
			</div>
		</div>
		<!-- /MARKETING LINE-->
</div>
<div class="container">
    
    <div class="row-fluid">
      <div class="span6 offset3">
        <div id="myCarousel" class="carousel slide vertical">
            <!-- Carousel items -->
            <div class="carousel-inner">
                <div class="active item">
                    <img src="http://placehold.it/600x400&amp;text=First+Slide">
                </div>
                <div class="item">
                    <img src="http://placehold.it/600x400&amp;text=Second+Slide">
                </div>
                <div class="item">
                    <img src="http://placehold.it/600x400&amp;text=Third+Slide">
                </div>
            </div>
            <!-- Carousel nav -->
            <a class="carousel-control left" href="#myCarousel" data-slide="prev">‹</a>
            <a class="carousel-control right" href="#myCarousel" data-slide="next">›</a>
        </div>
    </div>
</div>
</div>

CSS

.vertical .carousel-inner {
  height: 100%;
}

.carousel.vertical .item {
  -webkit-transition: 0.6s ease-in-out top;
     -moz-transition: 0.6s ease-in-out top;
      -ms-transition: 0.6s ease-in-out top;
       -o-transition: 0.6s ease-in-out top;
          transition: 0.6s ease-in-out top;
}

.carousel.vertical .active {
  top: 0;
}

.carousel.vertical .next {
  top: 400px;
}

.carousel.vertical .prev {
  top: -400px;
}

.carousel.vertical .next.left,
.carousel.vertical .prev.right {
  top: 0;
}

.carousel.vertical .active.left {
  top: -400px;
}

.carousel.vertical .active.right {
  top: 400px;
}

.carousel.vertical .item {
    left: 0;
}

.carousel.vertical .item.active {
  border:solid 2px #000;
        }

JavaScript

$('.carousel').carousel({
  interval: 3000
})