Karussell funktioniert nicht für bootstrap v4

Question

Ich arbeite an einem Web-Projekt und konfrontiert Problem mit Karussell, es bewegt sich nicht zum nächsten Bild durch Klicken oder sogar automatisch. Im Anschluss ist mein Code:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
    <div id="carousel-testimonial" class="carousel slide" data-ride="carousel"> 
 
    <ol class="carousel-indicators"> 
 
     <li data-target="#carousel-testimonial" data-slide-to="0" class="active"></li> 
 
     <li data-target="#carousel-testimonial" data-slide-to="1"></li> 
 
     <li data-target="#carousel-testimonial" data-slide-to="2"></li> 
 
    </ol> 
 
    <div class="carousel-inner" role="listbox"> 
 
     <div class="carousel-item active text-center"> 
 
      <img src="images/client-01.jpg" alt="testimonial" class="center-block"> 
 
      <div class="testimonial-caption"> 
 
       <h2>Danial</h2> 
 
       <h4><span>Sr. Software Engineer, </span>Blue Gyms</h4> 
 
       <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et olore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip."</p> 
 
      </div> 
 
     </div> 
 
     <div class="carousel-item text-center"> 
 
      <img src="images/client-02.jpg" alt="testimonial" class="center-block"> 
 
      <div class="testimonial-caption"> 
 
       <h2>Rauls Pole</h2> 
 
       <h4><span>Marketing Manager, </span>Risco</h4> 
 
       <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et olore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip."</p> 
 
      </div> 
 
     </div> 
 
     <div class="carousel-item text-center"> 
 
      <img src="images/client-03.jpg" alt="testimonial" class="center-block"> 
 
      <div class="testimonial-caption"> 
 
       <h2>Jack</h2> 
 
       <h4><span>Sr. Software Engineer, </span>Blue Gyms</h4> 
 
       <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et olore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip."</p> 
 
      </div> 
 
     </div> 
 
    </div> 
 
</div>

Answer 1

Sie haben vergessen, die Tasten in Ihr Karussell aufzunehmen. Dies sind die a-Links am Ende des folgenden Beispiels. Haben Sie jQuery und die Bootstrap 4 JavsScripts in Ihrem Projekt installiert? Sie finden alle notwendigen Zeilen here.

<div id="carousel-testimonial" class="carousel slide" data-ride="carousel"> 
    <ol class="carousel-indicators"> 
     <li data-target="#carousel-testimonial" data-slide-to="0" class="active"></li> 
     <li data-target="#carousel-testimonial" data-slide-to="1"></li> 
     <li data-target="#carousel-testimonial" data-slide-to="2"></li> 
    </ol> 
    <div class="carousel-inner" role="listbox"> 
     <div class="carousel-item active text-center"> 
      <img src="images/client-01.jpg" alt="testimonial" class="center-block"> 
      <div class="testimonial-caption"> 
       <h2>Danial</h2> 
       <h4><span>Sr. Software Engineer, </span>Blue Gyms</h4> 
       <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore 
        et olore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut 
        aliquip."</p> 
      </div> 
     </div> 
     <div class="carousel-item text-center"> 
      <img src="images/client-02.jpg" alt="testimonial" class="center-block"> 
      <div class="testimonial-caption"> 
       <h2>Rauls Pole</h2> 
       <h4><span>Marketing Manager, </span>Risco</h4> 
       <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore 
        et olore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut 
        aliquip."</p> 
      </div> 
     </div> 
     <div class="carousel-item text-center"> 
      <img src="images/client-03.jpg" alt="testimonial" class="center-block"> 
      <div class="testimonial-caption"> 
       <h2>Jack</h2> 
       <h4><span>Sr. Software Engineer, </span>Blue Gyms</h4> 
       <p>"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore 
        et olore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut 
        aliquip."</p> 
      </div> 
     </div> 
     <a class="carousel-control-prev" href="#carousel-testimonial" 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="#carousel-testimonial" role="button" data-slide="next"> 
      <span class="carousel-control-next-icon" aria-hidden="true"></span> 
      <span class="sr-only">Next</span> 
     </a> 
    </div> 
</div>