css 我的下一个和上一个按钮不起作用

k97glaaz 于 2023-03-05 发布在其他

关注(0)|答案(1)|浏览(157)

我希望我的按钮工作，因为我点击他们，他们没有工作的按钮图标仍然存在，但没有功能，我试图添加最新版本的bootstrap和js在我的头标签太

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">

<div id="testimonial-carousel" class="carousel slide">
  <div class="carousel-inner">
    <div class="carousel-item active">
      <h2>I no longer have to sniff other dogs for love. I've found the hottest Corgi on TinDog. Woof.</h2>
      <img class="testi-img" src="https://via.placeholder.com/300x100" alt="dog-profile">
      <em>Pebbles, New York</em>
    </div>
    
    <div class="carousel-item">
      <h2 class="testimonial-text">My dog used to be so lonely, but with TinDog's help, they've found the love of their life. I think.</h2>
      <img class="testimonial-image" src="https://via.placeholder.com/300x100" alt="lady-profile">
      <em>Beverly, Illinois</em>
    </div>
  </div>
  
  <button class="carousel-control-prev" type="button" data-bs-target="#testimonial-carousel" data-bs-slide="prev">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="visually-hidden">Previous</span>
  </button>
  
  <button class="carousel-control-next" type="button" data-bs-target="#testimonial-carousel" data-bs-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="visually-hidden">Next</span>
  </button>
</div>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script>

css

来源：https://stackoverflow.com/questions/75584533/my-next-and-previous-buttons-are-not-working

1条答案

按热度按时间

mo49yndu1#

添加bootstrap js文件，它将完美地工作：

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.min.js"></script>

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet"/>

<div id="testimonial-carousel" class="carousel slide">
  <div class="carousel-inner">
    <div class="carousel-item active">
          <h2>I no longer have to sniff other dogs for love. I've found the hottest Corgi on TinDog. Woof.</h2>
          <img class="testi-img" src="images/dog-img.jpg" alt="dog-profile">
          <em>Pebbles, New York</em>
    </div>
    <div class="carousel-item">
                  <h2 class="testimonial-text">My dog used to be so lonely, but with TinDog's help, they've found the love of their life. I think.</h2>
          <img class="testimonial-image" src="images/lady-img.jpg" alt="lady-profile">
          <em>Beverly, Illinois</em>
    </div>
  </div>
  <button class="carousel-control-prev" type="button" data-bs-target="#testimonial-carousel" data-bs-slide="prev">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="visually-hidden">Previous</span>
  </button>
  <button class="carousel-control-next" type="button" data-bs-target="#testimonial-carousel" data-bs-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="visually-hidden">Next</span>
  </button>
</div>

赞(0）回复(0）举报 2023-03-05

我来回答

css 我的下一个和上一个按钮不起作用

1条答案

相关问题

热门标签

最新问答