It worked! Thank you Sent from Matt's iPhone
On Sep 24, 2012, at 2:55 AM, "Barry vd. Heuvel" <[email protected]> wrote: > Add # to the href in the next/prev button: > <a class="carousel-control left" href="#about-me-carousel" > data-slide="prev">‹</a> > > On Sat, Sep 22, 2012 at 12:41 AM, Matt Craig <[email protected]> wrote: >> I used the code off tuts+ tutorial and everything seems to be working with >> the carousel accept the right and left controls. any suggestions? >> >> HTML >> <div id="about-me-carousel" class="carousel slide"><!-- class of slide for >> animation --> >> <div class="carousel-inner"> >> <div class="item active"><!-- class of active since it's the >> first item --> >> <img src="http://placehold.it/1200x480"; alt="" /> >> <div class="carousel-caption"> >> <p>Caption text here</p> >> </div> >> </div> >> <div class="item"> >> <img src="http://placehold.it/1200x480"; alt="" /> >> <div class="carousel-caption"> >> <p>Caption text here</p> >> </div> >> </div> >> <div class="item"> >> <img src="http://placehold.it/1200x480"; alt="" /> >> <div class="carousel-caption"> >> <p>Caption text here</p> >> </div> >> </div> >> <div class="item"> >> <img src="http://placehold.it/1200x480"; alt="" /> >> <div class="carousel-caption"> >> <p>Caption text here</p> >> </div> >> </div> >> </div><!-- /.carousel-inner --> >> <!-- Next and Previous controls below >> href values must reference the id for this carousel --> >> <a class="carousel-control left" href="about-me-carousel" >> data-slide="prev">‹</a> >> <a class="carousel-control right" href="about-me-carousel" >> data-slide="next">›</a> >> </div><!-- /.carousel --> >> >> JQ >> <!-- Link jQuery via Google + local fallback, see h5bp.com --> >> <script >> src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1./jquery.min.js"></script> >> <script>window.jQuery || document.write('<script >> src="js/jquery-1.8.1.min.js"><\/script>')</script> >> >> <!----------------------------------------------------------------------------------------------------------------------------------------> >> <script src="js/bootstrap.min.js"></script> >> >> <!----------------- carousel -----------------> >> <script> >> $(document).ready(function(){ >> $('.carousel').carousel({ >> interval: 4000 >> }); >> }); >> </script> >> <!----------------- end carousel -----------------> >
