旋转木马滑动不会在铬和mozilla滑动

时间:2017-05-31 12:17:04

标签: html google-chrome

我在我的网页上添加了一个旋转木马幻灯片。它在网络浏览器中工作正常,但在Chrome和mozilla中没有。我的意思是旋转木马会在几秒钟后自动滑动。它会给其他人带来滑动效果但不会在chrome和mozilla中虽然图像正在变化。我如何给出铬的滑动效果。

以下是代码:

    <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
    <link rel="stylesheet" type="text/css" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css">
    <div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="3000" style="margin-top:-22px; margin-left:-15px; margin-right:-15px;">
        <!-- 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>
            <li data-target="#myCarousel" data-slide-to="5"></li>
        </ol>
        <!-- Wrapper for slides -->
        <div class="carousel-inner">
            <div class="item active">
                <img src="http://lorempixel.com/900/400/" alt="slid0" class="img-responsive">
                <div class="carousel-caption"></div>
            </div>
            <div class="item">
                <img src="http://lorempixel.com/900/400/" alt="slid1" class="img-responsive">
                <div class="carousel-caption"></div>
            </div>
            <div class="item">
                <img src="http://lorempixel.com/900/400/" alt="slid2" class="img-responsive">
                <div class="carousel-caption"></div>
            </div>
            <div class="item">
                <img src="http://lorempixel.com/900/400/" alt="slid3" class="img-responsive">
                <div class="carousel-caption"></div>
            </div>
            <div class="item">
                <img src="http://lorempixel.com/900/400/" alt="slid4" class="img-responsive">
                <div class="carousel-caption"></div>
            </div>
            <div class="item">
                <img src="http://lorempixel.com/900/400/" alt="slid5" class="img-responsive">
                <div class="carousel-caption"></div>
            </div>
        </div>
        <!-- Controls --> <a class="left carousel-control" href="#myCarousel" data-slide="prev">
            <span class="icon-prev"></span>
        </a>
        <a class="right carousel-control" href="#myCarousel" data-slide="next">
            <span class="icon-next"></span>
        </a>

    </div>

2 个答案:

答案 0 :(得分:0)

尝试清除Google Chrome的缓存。我遇到了类似的问题,清除缓存后解决了这些问题。

答案 1 :(得分:0)

你需要jQuery来使它工作。您可以添加

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>

到你的代码(在javascript for bootstrap上面)快速添加jQuery。