Skip to main content
Known Participant
February 18, 2022
Answered

Boostrap Carousel - Why do slides stop when mouse is hovering?

  • February 18, 2022
  • 2 replies
  • 1717 views

Hi,

 

I'm kinda new to Bootstrap and I created a carousel.  I've noticed that whenever I hover my mouse over it the carousel stops.  I don't want this to happen.  I did a little research and found if I put in "data-pause=false" or "data-bs-pause="false" that it would correct this.  I tried doing this and it still pauses whenever the mouse hovers.

 

Here is the website:

http://taffyproductions.com/test/

 

Thanks for any help.

 

PS. What does the "bs" code mean?  Bootstrap?  I've noticed that newer versions of Bootstrap want the "data" item to be "data-bs"

This topic has been closed for replies.
Correct answer osgood_

Instead of applying - data-bs-interval="500" data-bs-pause="false" - to each of your individual <divs> apply it to your wrapper div, like below:

 

<div id="myCarousel" class="carousel slide carousel-fade" data-bs-ride="carousel" data-bs-interval="500" data-bs-pause="false">

 

I think the 'bs' is to distinguish between versions of Bootstrap. Version 5 was the first version to use vanilla javascript to control the Bootstrap components, previous versions used jQuery. There was a lot of major changes in version 5. 

2 replies

TaffyproAuthor
Known Participant
February 18, 2022

You rock!

 

Thanks

 

Gary

osgood_Correct answer
Legend
February 18, 2022

Instead of applying - data-bs-interval="500" data-bs-pause="false" - to each of your individual <divs> apply it to your wrapper div, like below:

 

<div id="myCarousel" class="carousel slide carousel-fade" data-bs-ride="carousel" data-bs-interval="500" data-bs-pause="false">

 

I think the 'bs' is to distinguish between versions of Bootstrap. Version 5 was the first version to use vanilla javascript to control the Bootstrap components, previous versions used jQuery. There was a lot of major changes in version 5.