引导程序3轮播的控件不起作用

Question

I'm trying to create an image carousel with bootstrap 3. The images will slide on their own after a set amount of time, but I cannot get the controls to slide the images. 我正在尝试使用bootstrap 3创建图像轮播。图像会在设置的时间后自行滑动，但是我无法获得滑动图像的控件。 It seems like I'm following the docs exactly. 似乎我完全在关注文档。 I've included the HTML as well as a jsfiddle: 我包括了HTML以及jsfiddle：

http://jsfiddle.net/L03rcutv/ http://jsfiddle.net/L03rcutv/

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
  <body>
   <nav class="navbar navbar-default navbar-fixed-top"><a class="navbar-brand">Test</a></nav>
<div class="container">
  <div class="row">
    <div style="height:100px;" class="col-md-12"></div>
  </div>
</div>
<div style="border-right:1px solid #E7E7E7;" class="container listingContainer">
  <div style="border-top:1px solid #E7E7E7;border-bottom:1px solid #E7E7E7;" class="row">
    <div class="col-md-5 leftAdjust">
      <div id="myCarousel" data-ride="carousel" class="carousel-slide">
        <ol class="carousel-indicators">
          <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
          <li data-target="#myCarousel" data-slide-to="1"></li>
        </ol>
        <div role="listbox" class="carousel-inner">
          <div class="item active"><img src="http://www.nationalparks.nsw.gov.au/~/media/NPWS/Images/Parks/Yuraygir-National-Park/Background/pebbly-beach-camp.ashx" style="width:100%;height:327px"></div>
          <div class="item"><img src="http://static.hdw.eweb4.com/media/thumbs/1/111/1101776.jpg" style="width:100%;height:327px"></div>
        </div><a href="#myCarousel" role="button" data-slide="prev" class="carousel-control left"><span aria-hidden="true" class="glyphicon glyphicon-chevron-left"></span></a><a href="#myCarousel" role="button" data-slide="next" class="carousel-control right"><span aria-hidden="true" class="glyphicon glyphicon-chevron-right"></span></a>
      </div>
    </div>
  </div>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<script src="/javascripts/main.js"></script>

Answer 1

You have a typo. 你有错字

<div id="myCarousel" data-ride="carousel" class="carousel-slide">

Should be: 应该：

<div id="myCarousel" data-ride="carousel" class="carousel slide">

You have a hyphen between carousel and slide in the class. 您在课程中的轮播和幻灯片之间有一个连字符。

FIDDLE 小提琴

引导程序3轮播的控件不起作用

问题描述

1 个解决方案

解决方案1
0 已采纳 2014-11-26 18:29:06

引导程序3轮播的控件不起作用

问题描述

1 个解决方案

解决方案1 0 已采纳 2014-11-26 18:29:06

解决方案1
0 已采纳 2014-11-26 18:29:06