bootstrap slider sliding images on mouseover

jQuery 0 Comment

Bootstrap slider sliding images on mouseover

Twitter bootstrap is a great resources for a front end developers. It includes all most necessary plugins to make an website interactive. At the same time if we talk about the bootstrap carousel, its one of the finest plugin to create a slider either for a content sliding or images sliding. The function for carousel work on click, so what if we want to make it work on mouseover. In this post I will show you how the bootstrap slider sliding images on mouseover.


$('#myCarousel').carousel({interval:false}); /*  initialized the carousel but don't start it  */
var myInterval=false;
$('.carousel-control').mouseover(function() {
    var ctrl = $(this);
    var interval=10;

    myInterval = setInterval(function(){
         ctrl.trigger("click");
    },interval);
});

$('.carousel-control').mouseout(function(){
    clearInterval(myInterval);
    myInterval = false;
});

Leave a Reply

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