javascript - bootstrap 3.1.1 carousel controls don't work -
i'm building website using bootstrap can't make carousel work @ all, left , right nor indicator change slide.
<div id="slideshow" class="carousel slide"> <ol class="carousel-indicators"> <li data-target="#slide0" data-slide-to="0" class="active"></li> <li data-target="#slide1" data-slide-to="1"></li> </ol> <div class="carousel-inner" role="listbox"> <!-- 1st slide --> <div class="item active" id="slide0"> <div id="mainfeature"> <div class="col-lg-6 col-lg-offset-1 col-md-6" > <img class="screenshot"> </div> <div class="col-lg-4 alta"> <h2>heading</h2> <p class="lefted">some text</p> <p class="lefted">other text</p> </div> </div> </div> <!-- second slide --> <div class="item" id="slide1"> <div id="mainfeature"> <div class="col-lg-6 col-lg-offset-1 col-md-6" > <img class="screenshot"> </div> <div class="col-lg-4 alta"> <h2>heading</h2> <p class="lefted">some text</p> <p class="lefted">other text</p> </div> </div> </div> </div> <!-- carousel nav --> <a class="carousel-control left" href="#slideshow" data-slide="prev">‹</a> <a class="carousel-control right" href="#slideshow" data-slide="next">›</a> </div>
this html markup, carousel displayed corretly , slideshow work automatically can't go next/prev slide.
i tried include script:
$('.carousel').carousel({ interval: 3000 }) $('.carousel-control.left').click(function() { $('#slide').carousel('prev'); }); $('.carousel-control.right').click(function() { $('#slide').carousel('next'); });
still no luck, , yes bootstrap.js linked html. advice?
<ol class="carousel-indicators"> <li data-target="#slide0" data-slide-to="0" class="active"></li> <li data-target="#slide1" data-slide-to="1"></li> </ol>
the indicators not working cause data-target id of carousel not slide.
data-target="#slideshow"
Comments
Post a Comment