<!-- DC Horizontal Carousel CSS --> <link type="text/css" rel="stylesheet" href="dreamcodes/carousel_hor/css/tsc_carousel_hor.css" /> <!-- jQuery Library (skip this step if already called on page ) --> <script type="text/javascript" src="dreamcodes/jquery.min.js"></script> <!-- (do not call twice) --> <!-- DC Horizontal Carousel JS --> <script type="text/javascript" src="dreamcodes/carousel_hor/js/jquery.bxslider2.min.js"></script> <script type="text/javascript" src="dreamcodes/carousel_hor/js/tsc_jqcarousel.js"></script> <!-- DC Horizontal Carousel Settings --> <script type="text/javascript"> $(function() {jQuery('.tsc_carousel_hor .carousel').jcarousel({scroll:1});}); </script>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla dictum, justo in feugiat vulputate, ante ante commodo libero, ut dignissim urna est sit amet est. In lacinia ultricies lectus quis tempus.
Cras facilisis euismod sapien, vitae ornare nunc vulputate ut. In ac nulla quis metus egestas imperdiet ac non lacus. Duis tincidunt, orci a dapibus lobortis, risus magna auctor velit.
Integer semper ultrices arcu, et porta dui condimentum vitae. Phasellus et urna ut lectus varius molestie at nec augue. Praesent at imperdiet quam. Ut posuere metus et orci auctor consectetur.
In facilisis urna quis ante sollicitudin ut consequat lectus dignissim. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
<script type="text/javascript"> $(function(){ $('#bxslides1').bxSlider({ prev_image: 'dreamcodes/carousel_hor/images/btn_arrow_left.jpg', next_image: 'dreamcodes/carousel_hor/images/btn_arrow_right.jpg', wrapper_class: 'bxslides1_wrap', margin: 70, auto: true, auto_controls: true }); }); </script> <div id="bxcontent"> <div id="bxcontent_inner"> <ul id="bxslides1"> <li> <img src="http://pimg.co/p/209x140" width="209" height="140" /> <div class="bxcontent"> <h3>Integrity</h3> <h4>Inspired by vision</h4> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla dictum, justo in feugiat vulputate, ante ante commodo libero, ut dignissim urna est sit amet est. In lacinia ultricies lectus quis tempus.</p> </div> <div class="clear"></div> </li> <li> <img src="http://pimg.co/p/209x140" width="209" height="140" /> <div class="bxcontent"> <h3>Relentless</h3> <h4>Pursuit of perfection</h4> <p>Cras facilisis euismod sapien, vitae ornare nunc vulputate ut. In ac nulla quis metus egestas imperdiet ac non lacus. Duis tincidunt, orci a dapibus lobortis, risus magna auctor velit.</p> </div> <div class="clear"></div> </li> <li> <img src="http://pimg.co/p/209x140" width="209" height="140" /> <div class="bxcontent"> <h3>Visionary</h3> <h4>Next generation</h4> <p>Integer semper ultrices arcu, et porta dui condimentum vitae. Phasellus et urna ut lectus varius molestie at nec augue. Praesent at imperdiet quam. Ut posuere metus et orci auctor consectetur.</p> </div> <div class="clear"></div> </li> <li> <img src="http://pimg.co/p/209x140" width="209" height="140" /> <div class="bxcontent"> <h3>Devotion</h3> <h4>Unparalleled</h4> <p>In facilisis urna quis ante sollicitudin ut consequat lectus dignissim. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p> </div> <div class="clear"></div> </li> </ul> </div> </div> <div class="tsc_clear"></div> <!-- line break/clear line -->
|
<!-- DC Horizontal Carousel:Light Start --> <div class="tsc_carousel_hor"> <div class="l-carousel"> <ul class="carousel"> <li> <a href="#"><img src="http://pimg.co/p/175x115" width="175" height="115" border="0" /></a> <h4><a href="#">Power</a></h4> <p>Suspendisse potenti. Nibh miry, ultricies ac molestie sit ameter vestibulum eget nunc. Vivamus vitae aliquam odio. </p> </li> <li> <a href="#"><img src="http://pimg.co/p/175x115" width="175" height="115" border="0" /></a> <h4><a href="#">Determination</a></h4> <p>Suspendisse potenti. Nibh miry, ultricies ac molestie sit ameter vestibulum eget nunc. Vivamus vitae aliquam odio. </p> </li> <li> <a href="#"><img src="http://pimg.co/p/175x115" width="175" height="115" border="0" /></a> <h4><a href="#">Belief</a></h4> <p>Suspendisse potenti. Nibh miry, ultricies ac molestie sit ameter vestibulum eget nunc. Vivamus vitae aliquam odio. </p> </li> <li> <a href="#"><img src="http://pimg.co/p/175x115" width="175" height="115" border="0" /></a> <h4><a href="#">Persistance</a></h4> <p>Suspendisse potenti. Nibh miry, ultricies ac molestie sit ameter vestibulum eget nunc. Vivamus vitae aliquam odio. </p> </li> <li> <a href="#"><img src="http://pimg.co/p/175x115" width="175" height="115" border="0" /></a> <h4><a href="#">Vision</a></h4> <p>Suspendisse potenti. Nibh miry, ultricies ac molestie sit ameter vestibulum eget nunc. Vivamus vitae aliquam odio. </p> </li> <li> <a href="#"><img src="http://pimg.co/p/175x115" width="175" height="115" border="0" /></a> <h4><a href="#">Focus</a></h4> <p>Suspendisse potenti. Nibh miry, ultricies ac molestie sit ameter vestibulum eget nunc. Vivamus vitae aliquam odio. </p> </li> <li> <a href="#"><img src="http://pimg.co/p/175x115" width="175" height="115" border="0" /></a> <h4><a href="#">Wisdom</a></h4> <p>Suspendisse potenti. Nibh miry, ultricies ac molestie sit ameter vestibulum eget nunc. Vivamus vitae aliquam odio. </p> </li> <li> <a href="#"><img src="http://pimg.co/p/175x115" width="175" height="115" border="0" /></a> <h4><a href="#">Opportunistic</a></h4> <p>Suspendisse potenti. Nibh miry, ultricies ac molestie sit ameter vestibulum eget nunc. Vivamus vitae aliquam odio. </p> </li> </ul> </div> <!-- DC Horizontal Carousel:Light End --> <div class="tsc_clear"></div> <!-- line break/clear line -->
|
<!-- DC Horizontal Carousel:Dark Start --> <div class="tsc_carousel_hor"> <div class="d-carousel"> <ul class="carousel"> <li> <a href="#"><img src="http://pimg.co/p/175x115" width="175" height="115" border="0" /></a> <h4><a href="#">Power</a></h4> <p>Suspendisse potenti. Nibh miry, ultricies ac molestie sit ameter vestibulum eget nunc. Vivamus vitae aliquam odio. </p> </li> <li> <a href="#"><img src="http://pimg.co/p/175x115" width="175" height="115" border="0" /></a> <h4><a href="#">Determination</a></h4> <p>Suspendisse potenti. Nibh miry, ultricies ac molestie sit ameter vestibulum eget nunc. Vivamus vitae aliquam odio. </p> </li> <li> <a href="#"><img src="http://pimg.co/p/175x115" width="175" height="115" border="0" /></a> <h4><a href="#">Belief</a></h4> <p>Suspendisse potenti. Nibh miry, ultricies ac molestie sit ameter vestibulum eget nunc. Vivamus vitae aliquam odio. </p> </li> <li> <a href="#"><img src="http://pimg.co/p/175x115" width="175" height="115" border="0" /></a> <h4><a href="#">Persistance</a></h4> <p>Suspendisse potenti. Nibh miry, ultricies ac molestie sit ameter vestibulum eget nunc. Vivamus vitae aliquam odio. </p> </li> <li> <a href="#"><img src="http://pimg.co/p/175x115" width="175" height="115" border="0" /></a> <h4><a href="#">Vision</a></h4> <p>Suspendisse potenti. Nibh miry, ultricies ac molestie sit ameter vestibulum eget nunc. Vivamus vitae aliquam odio. </p> </li> <li> <a href="#"><img src="http://pimg.co/p/175x115" width="175" height="115" border="0" /></a> <h4><a href="#">Focus</a></h4> <p>Suspendisse potenti. Nibh miry, ultricies ac molestie sit ameter vestibulum eget nunc. Vivamus vitae aliquam odio. </p> </li> <li> <a href="#"><img src="http://pimg.co/p/175x115" width="175" height="115" border="0" /></a> <h4><a href="#">Wisdom</a></h4> <p>Suspendisse potenti. Nibh miry, ultricies ac molestie sit ameter vestibulum eget nunc. Vivamus vitae aliquam odio. </p> </li> <li> <a href="#"><img src="http://pimg.co/p/175x115" width="175" height="115" border="0" /></a> <h4><a href="#">Opportunistic</a></h4> <p>Suspendisse potenti. Nibh miry, ultricies ac molestie sit ameter vestibulum eget nunc. Vivamus vitae aliquam odio. </p> </li> </ul> </div> <!-- DC Horizontal Carousel:Dark End --> <div class="tsc_clear"></div> <!-- line break/clear line -->
© TemplateAccess