swiper
swiper copied to clipboard
FEATURE REQUEST: Auto-Play Progress Bar
So a bit like the 'pagination progress' bar, but one that builds-up to show you how much time you have left on the current slide before the next one comes in where the progress bar would then reset again.
Example: https://revolution.themepunch.com/jquery/travel-slideshow-jquery/
(Also with the option to have the progress bar at either the top or bottom)
Thanks,
Mike
Hi MikeyJN, a few months ago I needed this feature. I created this codepen: https://codepen.io/Bluxart/pen/MWyejBr
I'm not sure it will work with the latest release of Swiper, but I think it's a great point to start.
Cheers
Hi,
Thanks for posting your codepen. To be honest I did create something similar, but I found it caused flickering issues with other animations running on the site such as elements that become visible when in view. I also noticed that on Firefox the progress bar was taking far longer to complete compared to Chrome.
So I took a different approach - this time I let CSS solely handle the animation of the progress bar and used JavaScript along with Swiper's API to handle the slide changes. It works much better this way in my opinion - take a look... https://codepen.io/mikeyjn/pen/gOmqLjp
Regards, Mike
if it's help someone :) https://codepen.io/ssylvain1989/pen/LYdeoNB
Issue is closed because of outdated/irrelevant/not actual/needed more information/inactivity.
If this issue is still actual and reproducible for latest version of Swiper, please create new issue and fill the issue template correctly:
- Clearly describe the issue including steps to reproduce when it is a bug.
- Make sure you fill in the earliest version that you know has the issue.
- Provide live link or JSFiddle/Codepen or website with issue