2014-09-23 2 views
0

여기에서 문제가 무엇이라고 생각하십니까?부트 스트랩 회전 장치가 제대로 작동하지 않습니다.

<html> 
    <head> 
    <meta charset="utf-8"> <!-- for character ">>" --> 
    <!-- solve problem for icon's flat UI --> 

    <title>Welcome!</title> 
    <link href="css/bootstrap.css" rel="stylesheet"> 
    <link href="css/bootstrap.min.css" rel="stylesheet">  
    <link href="css/bootstrap-theme.css" rel="stylesheet"> 
    <link href="css/bootstrap-theme.min.css" rel="stylesheet"> 
    <script src="javascript/jquery.js"> </script> 
    <script src="javascript/jquery.validate.min.js"> </script> 
    <script src="javascript/jquery-ui-1.9.2.custom.min.js"></script> 
    <script src="javascript/bootstrap.js"></script> 
    <script src="javascript/carousel.js"></script> 
    </head> 

    <body> 

    . . . . 

<div id="carousel-example-generic" class="carousel slide" data-ride="carousel"> 
    <!-- Indicators --> 
    <ol class="carousel-indicators"> 
    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li> 
    <li data-target="#carousel-example-generic" data-slide-to="1"></li> 
    <li data-target="#carousel-example-generic" data-slide-to="2"></li> 
    </ol> 

    <!-- Wrapper for slides --> 
    <div class="carousel-inner"> 
    <div class="item active"> 
    <img src="..." alt="..."> 
    <div class="carousel-caption"> 
    ... 
    </div> 
    </div> 
    <div class="item"> 
    <img src="..." alt="..."> 
    <div class="carousel-caption"> 
    ... 
    </div> 
    </div> 
    ... 
    </div> 

    <!-- Controls --> 
    <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"> 
    <span class="glyphicon glyphicon-chevron-left"></span> 
    </a> 
    <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"> 
    <span class="glyphicon glyphicon-chevron-right"></span> 
    </a> 
    </div> 

정확한 캐 러셀이 표시되지 않습니다. 대신 누락 된 링크가 있지만 스크롤하는 기능이 있습니다. 포함해야하는 .js 및 .css와 관련이 있습니까? 어떤 아이디어?

+0

'...'가 문제입니다. '...'는 이미지가 아닙니다. 또한 회전 장치를 초기화했는지 확인하십시오. 나는 당신이 더 많은 링크를 포함했다는 것을 지적하고 싶다. 예를 들어서'css/bootstrap.css'와'css/bootstrap.min.css'는 같은 것입니다 ('.min'은 모든 것이 공간을 절약하기 위해 콤팩트하다는 것을 의미합니다). 또한 jQuery가 두 번 포함 된 것처럼 보입니다. –

답변

1

이것은 부트 스트랩 웹 사이트의 정확한 코드와 같습니다. 당신이 실제로 경로가

... 
<div class='item'> 
    <img src='<!-- whatever the path to your image is -->'> <!-- this is what is missing --> 
    <div class='carousel-caption'> 
    </div> 
    ... 

또한 이미지 소스에 대해 설정해야하기 때문에 어느 쪽이든, 누락 된 링크가이 코드에 당신을 위해 게재되는 이유는 뭔가에 회전 목마의 ID를 변경할 것입니다 귀하의 웹 페이지에 의미가 있으며 귀하를 추적하기 쉽습니다. 할 때 새로운 컨베이어 ID의 ID와 일치하도록 컨트롤의 'href'속성을 변경하는 것을 잊지 마세요. 그렇지 않으면 그것이 스크롤하고 있다면, 당신은 그것을 올바르게 설정 한 것 같습니다. 실제로 이미지의 경로를 추가했는지 확인하십시오. 코드에서

0

사용이,이

도움이 당신이를 사용하여 initilize해야 할 수 있습니다 희망 :

$('.carousel').carousel() 
관련 문제