HMShingala

Simple Slider In Bootstrap

Bootstrap Example

https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js
http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js

.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
width: 70%;
margin: auto;
}

Activate Carousel with JavaScript

$(document).ready(function(){
// Activate Carousel
$(“#myCarousel”).carousel();

// Enable Carousel Indicators
$(“.item1”).click(function(){
$(“#myCarousel”).carousel(0);
});
$(“.item2”).click(function(){
$(“#myCarousel”).carousel(1);
});
$(“.item3”).click(function(){
$(“#myCarousel”).carousel(2);
});
$(“.item4”).click(function(){
$(“#myCarousel”).carousel(3);
});

// Enable Carousel Controls
$(“.left”).click(function(){
$(“#myCarousel”).carousel(“prev”);
});
$(“.right”).click(function(){
$(“#myCarousel”).carousel(“next”);
});
});

By Harshit Shingala

2 Responses

Leave a Reply

Your email address will not be published. Required fields are marked *

twenty − nineteen =