2017-05-31 1 views
0

私のページにカルーセルスライドを追加しました。インターネットエクスプローラではうまくいきますが、クロムとモジラではうまくいきません。数秒後にカルーセルが自動的にスライドします。画像は変化していますが、クロムやモジラでは表示されません。クロムのスライド効果はどうやって得られますか?ここでキャロルスライドがクロムとモズミで滑っていない

はコードです:

<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> 
+0

あなたが使用している 'scripts'について言及できましたか? – TheDarkKnight

答えて

0

は、Google Chromeののキャッシュをクリアしてみてください。私は同様の問題に直面し、キャッシュをクリアした後に解決されました。

+0

did.Nothing changed – ani

0

jQueryが動作するようにする必要があります。 jQueryをすばやく追加するために、コードにコードを(ブートストラップ用のjavascriptの上に)

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

の行に追加することができます。

関連する問題