부트 스트랩 4 회전식 컨트롤이 작동하지 않습니다.

이전에는이 문제가 없었지만 이유가 무엇이든 기본 BS4 회전식 회전 장치에 대한 회전식 컨트롤이 작동하지 않습니다. 흥미롭게도 지표는 클릭 할 때 작동합니까?부트 스트랩 4 회전식 컨트롤이 작동하지 않습니다.

<div class="col-md-6"> 
    <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel"> 
     <ol class="carousel-indicators"> 
      <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li> 
      <li data-target="#carouselExampleIndicators" data-slide-to="1"></li> 
      <li data-target="#carouselExampleIndicators" data-slide-to="2"></li> 
     </ol> 
     <div class="carousel-inner"> 
      <div class="carousel-item active"> 
       <div class="embed-container"> 
        <iframe src="https://www.youtube.com/embed/..." frameborder="0" allowfullscreen></iframe> 
       </div> 
      </div> 
      <div class="carousel-item"> 
       <div class="embed-container"> 
        <iframe src="https://www.youtube.com/embed/..." frameborder="0" allowfullscreen></iframe> 
       </div> 
      </div> 
      <div class="carousel-item"> 
       <div class="embed-container"> 
        <iframe src="https://www.youtube.com/embed/..." frameborder="0" allowfullscreen></iframe> 
       </div> 
      </div> 
     </div> 
     <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev"> 
      <span class="carousel-control-prev-icon" aria-hidden="true"></span> 
      <span class="sr-only">Previous</span> 
     </a> 
     <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next"> 
      <span class="carousel-control-next-icon" aria-hidden="true"></span> 
      <span class="sr-only">Next</span> 
     </a> 
    </div> 
</div>

출처

2017-12-14 Sandra Willford

popper.js을 추가하면 도움이됩니다.

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.6/umd/popper.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"></script> 
 
</head> 
 
<body> 
 
    
 
<div class="col-md-6"> 
 
    <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel"> 
 
     <ol class="carousel-indicators"> 
 
      <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li> 
 
      <li data-target="#carouselExampleIndicators" data-slide-to="1"></li> 
 
      <li data-target="#carouselExampleIndicators" data-slide-to="2"></li> 
 
     </ol> 
 
     <div class="carousel-inner"> 
 
      <div class="carousel-item active"> 
 
       <div class="embed-container"> 
 
        <iframe src="https://www.youtube.com/embed/..." frameborder="0" allowfullscreen></iframe> 
 
       </div> 
 
      </div> 
 
      <div class="carousel-item"> 
 
       <div class="embed-container"> 
 
        <iframe src="https://www.youtube.com/embed/..." frameborder="0" allowfullscreen></iframe> 
 
       </div> 
 
      </div> 
 
      <div class="carousel-item"> 
 
       <div class="embed-container"> 
 
        <iframe src="https://www.youtube.com/embed/..." frameborder="0" allowfullscreen></iframe> 
 
       </div> 
 
      </div> 
 
     </div> 
 
     <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev"> 
 
      <span class="carousel-control-prev-icon" aria-hidden="true"></span> 
 
      <span class="sr-only">Previous</span> 
 
     </a> 
 
     <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next"> 
 
      <span class="carousel-control-next-icon" aria-hidden="true"></span> 
 
      <span class="sr-only">Next</span> 
 
     </a> 
 
    </div> 
 
</div> 
 

 
</body> 
 
</html>

출처

2017-12-14 19:03:41

는 부트 스트랩 4 '에 item'은 더 이상 사용되지 않습니다. 문서에 따르면 이제 '회전 목마 항목'이됩니다. –

업데이트 된 답변 –

부트 스트랩 4 회전식 컨트롤이 작동하지 않습니다.

답변

관련 문제