Carousels

<div id="carousel-example-1" class="carousel slide" data-ride="carousel">
	<!-- Indicators -->
	<ol class="carousel-indicators">
		<li data-target="#carousel-example-1" data-slide-to="0" class="active"></li>
		<li data-target="#carousel-example-1" data-slide-to="1"></li>
		<li data-target="#carousel-example-1" data-slide-to="2"></li>
	</ol>
	<!-- Wrapper for slides -->
	<div class="carousel-inner">
		<div class="item active"><img src="slide1.jpg"></div>
		<div class="item"><img src="slide2.jpg"></div>
		<div class="item"><img src="slide3.jpg"></div>
	</div>
	<!-- Controls -->
	<a class="left carousel-control" href="#carousel-example-1" data-slide="prev">
		<span class="glyphicon glyphicon-chevron-left"></span>
	</a>
	<a class="right carousel-control" href="#carousel-example-1" data-slide="next">
		<span class="glyphicon glyphicon-chevron-right"></span>
	</a>
</div>
<div id="carousel-example-2" class="carousel slide alternative" data-ride="carousel">
  <!-- Indicators -->
  <ol class="carousel-indicators">
    <li data-target="#carousel-example-2" data-slide-to="0" class="active"></li>
    <li data-target="#carousel-example-2" data-slide-to="1"></li>
  </ol>
  <!-- Wrapper for slides -->
  <div class="carousel-inner">
    <div class="item active">
      <div class="row">
        <div class="col-md-3"><img src="image1.jpg" style="max-width:100%;"></div>
        <div class="col-md-3"><img src="image2.jpg" style="max-width:100%;"></div>
        <div class="col-md-3"><img src="image3.jpg" style="max-width:100%;"></div>
        <div class="col-md-3"><img src="image4.jpg" style="max-width:100%;"></div>
      </div>
    </div>
    <div class="item">
      <div class="row">
        <div class="col-md-3"><img src="image5.jpg" style="max-width:100%;"></div>
        <div class="col-md-3"><img src="image6.jpg" style="max-width:100%;"></div>
        <div class="col-md-3"><img src="image7.jpg" style="max-width:100%;"></div>
        <div class="col-md-3"><img src="image8.jpg" style="max-width:100%;"></div>
      </div>
    </div>
  </div>
  <!-- Controls -->
  <a class="left carousel-control" href="#carousel-example-2" data-slide="prev">
    <span class="glyphicon glyphicon-chevron-left"></span>
  </a>
  <a class="right carousel-control" href="#carousel-example-2" data-slide="next">
    <span class="glyphicon glyphicon-chevron-right"></span>
  </a>
</div>

Disclaimer

All stock images on this template demo are for presentation purposes only, intended to represent a live site and are not included with this template.

Most of the images used here are available from shutterstock.com. Links are provided if you wish to purchase them from their copyright owners.

Contact Details

Quay View,
Mullaghmore,
Co. Sligo,
Ireland

Email: [email protected]
Website: www.website.com

Sample Menu