Know which slide you are passing in the bootstrap Carousel

Asked

Viewed 367 times

1

I have a bootstrap slide Carousel, I wanted to know the moment when a particular slide is passing on the screen using javascript or else stop on the last slide.

1 answer

2

I already found the solution, follow below the link to the example in w3schools http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_ref_js_carousel_event_slide&stacked=h

http://www.w3schools.com/bootstrap/bootstrap_ref_js_carousel.asp

Stayed like this: I put an id on each item and used 'slid.bs.Carousel' that occurs when the carousel runs from one item to another.

<header id="myCarousel" class="carousel slide">
<div class="carousel-inner">
    <div class="item active" id="1">
        <div class="fill" style="background-image:url('../img/foto1.png');"></div>
    </div>
    <div class="item" id="2">
        <div class="fill" style="background-image:url('../img/foto2.png');"></div>
    </div>
    <div class="item" id="3">
        <div class="fill" style="background-image:url('../img/foto3.png');"></div>

 <script>
    $('.carousel').carousel({
        interval: 5000 //changes the speed
    })

    $("#myCarousel").on('slid.bs.carousel', function () {
        var i = $(".active").attr("id");
        alert(i);
        console.log(i);
    });

</script>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.