2

私はしばらくの間、この Bootstrap カルーセルに苦労してきました。フォーラム全体を検索しましたが、うまくいきませんでした。コードは次のとおりです。

<!DOCTYPE html>
<html lang="pt">
  <head>
    <meta charset="UTF-8">
    <title>Sindicato de Hot&eacute;is, Bares, Restaurantes e Similares do Litoral Norte do RS</title>
    <link href="assets/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen" />
    <link href="css/index.css" rel="stylesheet" />
    <script type="text/javascript" src="assets/bootstrap/js/bootstrap.js"></script>
    <script type="text/javascript" src="assets/js/jquery.js"></script>
    <script type="text/javaScript">
      <!--
        $(document).ready(function(){
          $("#about").hide();
          $("#drop").click(function(){
            $("#about").toggle(200);
          });
          $('.carousel slide').carousel('cycle');
          //Conteúdos
          $("#body").load("home.html");
          $("#home").click(function(){
            $("#body").load("home.html");
          });
          $("#historia").click(function(){
            $("#body").load("historia.html");
          });
          $("#diretoria").click(function(){
            $("#body").load("diretoria.html");
          });
          $("#base").click(function(){
            $("#body").load("base.html");
          });
          $("#associe").click(function(){
            $("#body").load("associe.html");
          });
          $("#documentos").click(function(){
            $("#body").load("documentos.html");
          });
          $("#contato").click(function(){
            $("#body").load("contato.html");
          });
        });
      //-->
    </script>
  </head>
  <body>
    <div class="container">
      <div class="row-fluid">
        <div id="header" class="span12">
          <div class="span2"><img src="img/logo_small.png" /></div>
          <div class="span10">
            <div id="carousel" class="carousel slide">
              <div class="carousel-inner">
                <div class="active item">
                  <img src="img/carrousel1.jpg" alt="" />
                  <div class="carousel-caption">
                  <p>Torres: A Mais Bela Praia Ga&uacute;cha</p>
                </div>
              </div>
              <div class="item">
                <img src="img/carrousel2.jpg" alt="" />
                <div class="carousel-caption">
                  <p>Mostardas: uma carrada de passarinhos</p>
                </div>
              </div>
              <div class="item">
                <img src="img/carrousel3.jpg" alt="" />
                <div class="carousel-caption">
                  <p>Tr&ecirc;s Cachoeiras: t&atilde;o sem gra&ccedil; que a &uacute;nica atracao eh uma arvore</p>
                </div>
              </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>
        <div id="main" class="row-fluid">
          <div class="span12"><img src="img/header_orange.png" /></div>
        </div>
      </div>
      <div id="main" class="row-fluid">
        <div id="menu" class="span2">
          <div id="header_menu"><img src="img/top_menu.png" alt=""></div>
          <div id="options_menu">
            <ul class="unstyled">
              <li><label id="home">Home</label></li>
              <li><img src="img/line.png"></li>
              <li><label id="drop">Sindicato</label></li>
              <img src="img/line.png">
              <div id="about">
                <ul class="unstyled">
                  <li><label id="historia">Hist&oacute;ria</label></li>
                  <img src="img/line.png">
                  <li><label id="diretoria">Diretoria</label></li>
                  <img src="img/line.png">
                </ul>
              </div>
              <li><label id="base">Base territorial</label></li>
              <li><img src="img/line.png"></li>
              <li><label id="associe">Associe-se</label></li>
              <li><img src="img/line.png"></li>
              <li><label id="documentos">Documentos</label></li>
              <li><img src="img/line.png"></li>
              <li><label id="contato">Contato</label></li>
            </ul>
          </div>
          <div id="bottom_menu"><img src="img/top_menu.png" alt=""></div>
        </div>
        <div id="body" class="span10"></div>
      </div>
      <div id="footer">
        <strong>Sindicato de Hot&eacute;is, Bares, Restaurantes e Similares do Litoral Norte - RS</strong></br>
        <span>Rua Fernandes Bastos, 100 - sala 16 :: Tramanda&iacute;/RS :: CEP: 95590-000 :: 
            Fone: (51) 8116.9669 :: E-mail: <a href="mailto:#">contato@sindlitoralnorters.com.br</a></span></br>
      </div>
    </div>
  </div>
</body>
</html>

問題は、カルーセルが機能しないだけでなく、その後のすべてのコード$('.carousel).carousel()が無効になることです。jQuery の問題かもしれないと思いましたが、エラーは見つかりませんでした。.js ファイルは正しく、その場所も正しいです。その jQuery 行をコメントアウトすると、コードは再び機能します。

誰か助けてくれませんか？

4

2 に答える 2