Question

我讨厌这是我的第一个问题，但我已经看了一遍，并试图找出为什么我的代码无效。只加载第一张幻灯片，当您单击左箭头或右箭头时，它就像是一个“链接”，将您带到页面上的该位置。这是我到目前为止与此相关的内容（您可以在www.KatyEnglish.com上查看）。任何/所有帮助将不胜感激!!!谢谢！

<head>
    <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="css/styles.css">
    <link rel="stylesheet" href="js/textillate-master/assets/animate.css">
</head>

<div id="myCarousel" class="carousel slide" data-ride="carousel">
        <!-- Indicators -->
        <ol class="carousel-indicators">
            <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
            <li data-target="#myCarousel" data-slide-to="1"></li>
            <li data-target="#myCarousel" data-slide-to="2"></li>
            <li data-target="#myCarousel" data-slide-to="3"></li>
            <li data-target="#myCarousel" data-slide-to="4"></li>
        </ol>

        <!-- Wrapper for slides -->
        <div class="carousel-inner" role="listbox">
            <div class="item active">
            <img src="img/slider6.jpg" alt="Katy English Photography Portraits">
            </div>

            <div class="item">
            <img src="img/slider1.jpg" alt="Katy English Photography Portraits">
            </div>

            <div class="item">
            <img src="img/slider5.jpg" alt="Katy English Photography Portraits">
            </div>

            <div class="item">
            <img src="img/slider3.jpg" alt="Katy English Photography Portraits">
            </div>

            <div class="item">
            <img src="img/slider2.jpg" alt="Katy English Photography Portraits">
            </div>
        </div>


        <!-- Left and right controls -->
            <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
            <span class="sr-only">Previous</span>
            </a>
            <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
            <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
            <span class="sr-only">Next</span>
            </a>
    </div>

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://code.jquery.com/jquery.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/textillate-master/jquery.textillate.js"></script>
<script src="js/textillate-master/assets/jquery.fittext.js"></script>
<script src="js/textillate-master/assets/jquery.lettering.js"></script>
<script>
  $(function(){
    $('.tlt').textillate({
      in: {effect:'rollIn'}
    });
  })
</script>
<script type="text/javascript">
    $('#myCarousel').carousel({
        interval: 3000
        });
    });
</script>

Bootstrap Carousel不会初始化

0 个答案: