3

I'm having trouble making the carousel actually slide. It would just swap to next item without any "slide" transition. I've even went through the BS 5 doc and it doesn't do the slide transition either. Has it been removed?

HTML:

<div id="carouselExampleSlidesOnly" class="carousel slide" data-bs-slide ="true" data-bs-ride="carousel" data-bs-interval="1000" data-bs-pause="hover"> 
  <div class="carousel-inner">
    <div class="carousel-item active " style = "background-color:red">
      <img src="..." class="d-block w-100" alt="...">
    </div>
    <div class="carousel-item" style = "background-color:blue">
      <img src="..." class="d-block w-100" alt="...">
    </div>
    <div class="carousel-item" style = "background-color:yellow">
      <img src="..." class="d-block w-100" alt="...">
    </div>
  </div>
</div>

CSS:

.carousel-item {
    height: 500px;
}
isherwood
  • 58,414
  • 16
  • 114
  • 157
Vimalan Karunakaran
  • 149
  • 12

1 Answers1

0

Windows 10 > Display > Tick show animations in windows

Vimalan Karunakaran
  • 149
  • 12
  • 1
    That setting is on by default. See also https://getbootstrap.com/docs/5.0/getting-started/accessibility/#reduced-motion. – isherwood Feb 04 '21 at 16:26
  • 1
    And https://stackoverflow.com/questions/59708960/how-do-i-change-the-preferes-reduced-motion-setting-in-browsers. – isherwood Feb 04 '21 at 16:28