1

Bootstrap カルーセルは機能していますが、「スライド」アニメーションはありません。画像を差し替えるだけです。Twitter Bootstrap Carousel Not Sliding とTwitter Bootstrap Carousel Slide が機能しないことを確認しまし たが、そこの処方箋はうまくいかないようです。

私のbootstrap.jsファイルには、間違いなく「遷移」ビットが含まれています。そして、カルーセルが機能するので、そこに適切なクラスを取得していることは明らかです。スライド アニメーションが機能しない理由がわかりません。

HTML

<head>
    <title>LessonUp - Learn Piano Faster</title>
    <!--Put in CSS link-->
    <script src="http://code.jquery.com/jquery-1.7.1.js"></script>
    <link  type="text/css" href="stylesheets/bootstrap.css" rel="stylesheet" media="screen"/>
    <script src="js/bootstrap.js"></script>
    <!--<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-carousel.js"</script>-->
    <script>
    $(document).ready(function(){
        $('.carousel').carousel({
            interval:3000
        });
    });
    </script>
    <script>
        $(document).ready(function(){
            $("#email_submit").click(function(event){
                $(".alert-success").show();
                $(".alert-success").fadeOut(8000);
          });
      });
    </script>

カルーセル セクション

<!--Carousel-->
           <div class="span7 slide">
               <div id="myCarousel" class="carousel slide">
       <!--Carousel Items-->
                   <div class="carousel-inner">
                        <div class="active item"><img src="img/Library_shot.png"></div>
                            <div class="item"><img src="img/performance_shot.png"></div>
                            <div class="item"><img src="img/lesson_shot.png"></div>
                   </div>
        <!--Carousel Nav-->
                   <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
                   <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
                </div>
           </div>

出力は www.lessonupapp.com で確認できます。

4

1 に答える 1

0

あなたの画像が大きすぎるからだと思います...そして私はここで冗談を言っていません！小さくすると機能します。画像のサイズが5000pxx4000pxを超え、1MBを超えています...

于 2012-12-23T00:46:14.663 に答える