"Testimonial Carousel "
Bootstrap 3.2.0 Snippet by DJTanner001

<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <head> <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css"> </head> <section id="carousel"> <div class="container"> <div class="row"> <div class="col-md-8 col-md-offset-2"> <div class="quote"><i class="fa fa-quote-left fa-4x"></i></div> <div class="carousel slide" id="fade-quote-carousel" data-ride="carousel" data-interval="6000"> <!-- Carousel indicators --> <ol class="carousel-indicators"> <li data-target="#fade-quote-carousel" data-slide-to="0" class="active"></li> <li data-target="#fade-quote-carousel" data-slide-to="1"></li> <li data-target="#fade-quote-carousel" data-slide-to="2"></li> <li data-target="#fade-quote-carousel" data-slide-to="3"></li> <li data-target="#fade-quote-carousel" data-slide-to="4"></li> <li data-target="#fade-quote-carousel" data-slide-to="5"></li> <li data-target="#fade-quote-carousel" data-slide-to="6"></li> </ol> <!-- Carousel items --> <div class="carousel-inner"> <div class="active item"> <blockquote> <p>" 5 stars! Generous, enthusiastic, great fun, hard working and professional... Well done KL parties. Can't wait to book you again!!!."</p> <p>Sarah Creasey-Pukka Productions </p> </blockquote> </div> <div class="item"> <blockquote> <p>We got married on December 27th of 2014 at the Mount Sorrel Hotel, Barry. We hired KL Parties for the reception and it was a blast. Our reception was a big hit with everyone thanks to KL Parties. The music was just to evryones liking. Liam Tanner and his staff were very proffessional and good fun with us all. I would recommend KL Parties to anyone near and far."</p> <p>Peter and Sharon Watkins</p> </blockquote> </div> <div class="item"> <blockquote> <p>"Liam and his team at KL Parties are very motivated and hard working young adults. Liam recently provided Sound for our production of Disney's The Little Mermaid Jr. Whilst working for us, he listened carefully to the director's wishes and made sure that everything was as wanted. I am very pleased with Liam's care and attention to his work and will be hiring him for future projects."</p> <p>Christinas Bullen-Director of Superstars in the Making</p> </blockquote> </div> <div class="item"> <blockquote> <p>"Liam and his team at KL Parties have given good entertainment on 3 occasions. The party has gone well and I've been pleased with the professional approach, with the right element of fun. I have reccomended them and the host was really happy with them also. Don't be fooled by their young age as this is definitely a positive quality as they create a fantastic atmosphere. I wish them all the best of luck in the future."</p> <p>Carmen Walpole</p> </blockquote> </div> <div class="item"> <blockquote> <p>"I have had the pleasure of working with these guys at several of my events and cannot praise them highly enough. They are very amiable, experienced and professional offering a great range in their package. They have hosted and compèred events for me with fun and flair entertaining and engaging guests with quizzes and participation activities. They truly make any event a success and memorable for everyone who attends. I know I will have the pleasure of working with them again at any opportunity and highly recommend them for any event you have in mind."</p> <p>Diane Sparks</p> </blockquote> </div> <div class="item"> <blockquote> <p>"I would recommend these guys they do excellent disco and entertainment, my children enjoyed every minute."</p> <p>Adele Williams</p> </blockquote> </div> <div class="item"> <blockquote> <p>"Insert Testimonial by Helen Keegan here."</p> <p>Helen Keegan</p> </blockquote> </div> </div> </div> </div> </div> </div> </section>
/*-------------------------------*/ /* Code snippet by */ /* @maridlcrmn */ /*-------------------------------*/ section { padding-top: 100px; padding-bottom: 100px; } .quote { color: rgba(0,0,0,.1); text-align: center; margin-bottom: 30px; } /*-------------------------------*/ /* Carousel Fade Transition */ /*-------------------------------*/ #fade-quote-carousel.carousel { padding-bottom: 60px; } #fade-quote-carousel.carousel .carousel-inner .item { opacity: 0; -webkit-transition-property: opacity; -ms-transition-property: opacity; transition-property: opacity; } #fade-quote-carousel.carousel .carousel-inner .active { opacity: 1; -webkit-transition-property: opacity; -ms-transition-property: opacity; transition-property: opacity; } #fade-quote-carousel.carousel .carousel-indicators { bottom: 10px; } #fade-quote-carousel.carousel .carousel-indicators > li { background-color: #e84a64; border: none; } #fade-quote-carousel blockquote { text-align: center; border: none; } #fade-quote-carousel .profile-circle { width: 100px; height: 100px; margin: 0 auto; border-radius: 100px; }

Related: See More


Questions / Comments: