Twitter Bootstrap 회전 목마가 작동하지 않습니다 (3.1.1)

Twitter Bootstrap 3.1.1에서 작동하도록 간단한 회전 목마를 만들려고합니다. 스타일링없이 간단하게 일반적인 부트 스트랩 마크 업을 제거했지만 아직 이미지를 가져 오는 행운이 없었습니다. 어떤 제안이라도 고맙게 생각합니다. 내 마크 업은 다음과 같습니다.Twitter Bootstrap 회전 목마가 작동하지 않습니다 (3.1.1)

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <link rel="stylesheet" type="test/css" href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/css/bootstrap.css"> 
    <style type="text/css"> 
     .container{ 
     margin: 0 auto; 
     } 
    </style> 
    </head> 

    <body> 
    <div class="container"> 
     <!-- carousel --> 
     <div id="this-carousel-id" class="carousel slide"> 
     <div class="carousel-inner"> 
      <div class="item active"> 
      <img src="images/sample1.svg" alt="" /> 
      <div class="carousel-caption"> 
      </div> 
      </div> 
      <div class="item"> 
       <img src="images/sample2.svg" alt="" /> 
      <div class="carousel-caption"> 
      </div> 
      </div> 
      <div class="item"> 
       <img src="images/sample3.svg" alt="" /> 
      <div class="carousel-caption"> 
      </div> 
      </div> 
     </div> 
     <!-- .carousel-inner --> 
     <!-- next and previous controls here 
      href values must reference the id for this carousel --> 
     <a class="carousel-control left" href="#this-carousel-id" data-slide="prev">&lsaquo;</a> 
     <a class="carousel-control right" href="#this-carousel-id" data-slide="next">&rsaquo;</a> 
     </div> 
     <!-- .carousel --> 
     <!-- end carousel --> 
    </div><!-- /container --> 

    <!-- Javascript--> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
    <script>window.jQuery || document.write('<script src="js/jquery-1.7.2.min.js"><\/script>')</script> 
    <!-- Bootstrap jQuery plugins compiled and minified --> 
    <script src="js/bootstrap.min.js"></script> 
    <script> 
     $(document).ready(function(){ 
     $('.carousel').carousel({ 
      interval: 4000 
     }); 
     }); 
    </script> 
    </body> 
</html>

출처

2014-06-13 KPL

자바 스크립트 코드가 모두 올바르게로드 되었습니까? 상대 경로 인 js/bootstrap.min.js를 가리키고 있습니다. js 디렉토리가 실행중인 페이지와 동일한 레벨입니까? – jaapz

고마워요. 예, 다음과 같이 리디렉션되었습니다. http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/js/bootstrap.min.js 현재 작동 중입니다. – KPL

이는 아마도 bootstrap.min.js의 CDN 버전을 지정하지 않았기 때문일 수 있습니다.

당신이 jquery와 CDN 위치에서 CSS를 참조하고 있지만 귀하의 사이트에 로컬로 bootstrap.min.js를 찾고 있기 때문에 이것을 말합니다. 이게 어떻게 구성 되었습니까?

변경이

http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/js/bootstrap.min.js

이

출처

2014-06-13 12:23:20

그게 다야! 고쳐 - 고마워! – KPL

http://jsfiddle.net/8vvqf/은 어쩌면 당신은 대신 서버에서 직접 HTML 파일을 열 참조 사용할 수 있습니다. 그런 다음 CDN URL은
file://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js

변화
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

에 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

될 것하고 다시 시도?

출처

2014-06-13 13:08:48 szmtcjm

나는 이것을 시도하고 성공하지 못했다. – KPL

Twitter Bootstrap 회전 목마가 작동하지 않습니다 (3.1.1)

답변

관련 문제