ブートストラップカルーセル - bootplyで作業していますが、サイトにはありません。

Question

6つのロゴを表示しているカルーセルを作成しています。 Bootplyでは、すべてが正常に動作します：http://www.bootply.com/RkOFbrTp6F

私はここを参照してくださいWebページにそれを追加した場合：http://url.kybernaut.cz/1e、それは動作しますが、そこに行全体が移動されると、再び1、ない遅いだけ前進してロードのような動きは、より動的ですブーツリーの静かな動き。

どうすれば修正できますか？コードは同じように見えます。 jqueryコードは次のとおりです。

jQuery("#sponzoriCarousel").carousel({ 
      interval: 4000 
     }); 

     jQuery('.carousel .item').each(function(){ 
      var next = jQuery(this).next(); 
      if (!next.length) { 
      next = jQuery(this).siblings(':first'); 
      } 
      next.children(':first-child').clone().appendTo(jQuery(this)); 

      for (var i=0;i<4;i++) { 
      next=next.next(); 
      if (!next.length) { 
       next = jQuery(this).siblings(':first'); 
      } 

      next.children(':first-child').clone().appendTo(jQuery(this)); 
      } 
     }); 

ありがとうございます！

Answer 1

Starting with 3.3.0 versionブートストラップは、カルーセルの遷移にtransform-3dを使用します。

BootsplyでBootstrap 3.0.2を使用しています。しかし、あなたのウェブページには、ブートストラップのa very strange versionがあります。これは、URLで3.1を持っていますが、それはブートストラップ3.3.0からのコードの断片が含まれています

@media all and (transform-3d), (-webkit-transform-3d) { 
    .carousel-inner > .item { 
    -webkit-transition: -webkit-transform 0.6s ease-in-out; 
    -moz-transition: -moz-transform 0.6s ease-in-out; 
    -o-transition: -o-transform 0.6s ease-in-out; 
    transition: transform 0.6s ease-in-out; 
    -webkit-backface-visibility: hidden; 
    -moz-backface-visibility: hidden; 
    backface-visibility: hidden; 
    -webkit-perspective: 1000; 
    -moz-perspective: 1000; 
    perspective: 1000; 
    } 
    .carousel-inner > .item.next, 
    .carousel-inner > .item.active.right { 
    -webkit-transform: translate3d(100%, 0, 0); 
    transform: translate3d(100%, 0, 0); 
    left: 0; 
    } 
    .carousel-inner > .item.prev, 
    .carousel-inner > .item.active.left { 
    -webkit-transform: translate3d(-100%, 0, 0); 
    transform: translate3d(-100%, 0, 0); 
    left: 0; 
    } 
    .carousel-inner > .item.next.left, 
    .carousel-inner > .item.prev.right, 
    .carousel-inner > .item.active { 
    -webkit-transform: translate3d(0, 0, 0); 
    transform: translate3d(0, 0, 0); 
    left: 0; 
    } 
} 

はあなたbootstrap.cssからこのフラグメントを削除するか、またはthe real Bootstrap 3.0.2を使用してみてください。私はそれが助けると思う。