response-carousel-css3-jquery use css3 transition first if the browser doesn’t support it, then use jquery animate.
responsive automatic image slider in html, responsive image slider with text, jquery carousel slider, bootstrap responsive slider free download, responsive slider html css
Lightweight And Simple Image Carousel In Vanilla JavaScript | Crystal Slider
How to make use of it:
1. Load the required response-carousel.css in the header, and response-carousel.js in the bottom, after the jQuery library.
<head> ... <link href="responsive-carousel.css" rel="stylesheet"> ... </head> <body> ... <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="responsive-carousel.js"></script> ... </body>
2. Add your photos to the banner slider.
<div class="carousel">
<!-- Images here -->
<div class="carousel-inner">
<div class="slide active">
<a href=""><img src="1.jpg"></a>
</div>
<div class="slide">
<a href=""><img src="2.jpg"></a>
</div>
<div class="slide">
<a href=""><img src="3.jpg"></a>
</div>
</div>
<!-- Arrows navigation -->
<div class="arrow arrow-left"></div>
<div class="arrow arrow-right"></div>
</div>3. Custom logo slider options.
var opts = {
// CSS class for 'next' arrow
arrowRight : '.arrow-right',
// CSS class for 'prev' arrow
arrowLeft : '.arrow-left',
// Animation speed
speed : 700,
// Auto-play delay time
slideDuration : 4000
};4. Initialize the plugin.
$('.carousel').BannerSlide(opts);Responsive Banner Slider/Carousel, responsive carousel css3 jquery Plugin/Github
See Demo And Download
Official Website(sky790312): Click Here
This superior jQuery/javascript plugin is developed by sky790312. For extra advanced usage, please go to the official website.
