Bricks Version: 1.6.1
Browser: Chrome
OS: Windows
URL: https://creatormail.co
On the mentioned URL, I have two sliders, under the “Editor’s Pick” and “Interviews” section.
They have a single slide but use a query loop.
They were working just fine when I first created them, only today I realized they are now not working.
The sliding transition doesn’t take place when you use the arrow buttons to navigate but works when you drag them.
Below are the “Option” settings for Editor’s Pick.
Autoplay is working on both of your sliders for me when I visit the site from Chrome/Firefox (viewing from Macbook).
I asked some of my friends as well and they said it’s fine, It seems to exclusively not work for me, which is strange, I even changed browsers.
You are not alone. I have the same issue using the Chrome browser - on your website as well as one that I am currently building. When I use Firefox instead, everything is fine - again, on your website as well as mine.
Some more troubleshooting: Tested the websites on the Edge browser, and it is not working again. My guess is that this is a bug with the Chromium base, as Edge as well as Chrome are based on it.
Chrome version: Version 109.0.5414.120 (Official Build) (64-bit)
Edge version: Version 109.0.1518.70 (Official build) (64-bit)
It’d be worth checking the autoplay demo site on Splide’s website…
Because the behaviour is coming directly from Splide, it’s not custom in Bricks. If it’s not working there either, it must be an issue with Splide and a certain browser. If it is working there, but not working on your site, then it’ll be Bricks related.
Hi @pranavmahapatra ,
Thanks for reporting the issue.
As @wplit mentioned, can you try to check if the autoplay on the slider in this page working good?
The autoplay is working well on your website too from my end in Firefox and Chrome.
Regards,
Jenn
Hi! I have the same issue in two of my websites. The autoplay only works on the normal slider.
I would agree that it’s working for you since my fellows report the same. It’s working fine on mobile as well.
The autoplay slider on splide didn’t work for me and neither did the slider on my website. I changed browsers - chrome, chrome dev, opera, firefox.
Very strange.
This is something new. Did you also try with a mobile device?
Hi @pranavmahapatra ,
If you open up the dev tool console tab, is any error showing?
Otherwise, it might be related to your computer device then…
I will mark this topic as “No Bug” for now.
The slider was working fine previously for the time I first created it, (on desktop) one fine day I see the autoplay doesn’t work, clicking arrows changes the slide but there’s no animation, but dragging with mouse changes slides and the animation works fine.
Check that your OS doesn’t have ‘prefers reduced motion’ enabled, as this would cancel the autoplay and would be device-specific, which would explain why it’s working when viewing the same slider through other devices.
On Mac, it’s called ‘Reduce screen motion’. I’m not sure what it would be called on PC.
The default behaviour in Splide is to turn off the autoplay if this setting is enabled.
(it could be that the developer has turned this off for his demo pages, to make sure the Autoplay is always seen, which would explain why it’s working when you visit that page, but not when viewing sliders elsewhere)
If you wanted to test, the Splide option is called ‘reducedMotion’, where the defaults are;
{
reducedMotion: {
speed : 0,
rewindSpeed: 0,
autoplay : 'pause',
}
}
Not working on my mobile device (Android 12). Neither on Chrome, Firefox or Brave.
Well, I have the same error on one of my client websites (which I am not allowed to share, as of now) and also on the website of @pranavmahapatra.
Exactly the same behaviour: Working on Firefox on Desktop, not working on any other Chromium-based browser (Chrome, Edge, Brave). Not sure how to troubleshoot further.
Thank you, David! That’s the key.
@pranavmahapatra @4ndaKava ,
If you are on Windows, please hit Windows key and search for “Settings”.
Then navigate to Display. Please ensure you turn on Show animations in windows
I tried turning it off and all Splide is not autoplay now.
Hope this resolves your issue.
You’re right, this was the issue. Thank you so much!
Hello, sorry if I may have missed something in the thread… But for me the problem is not solved. My animations (with the nestible slider, but also via conditions (event: enter viewport) are completely disabled when I have “reduce motion” enabled. This is true for all my ios devices, MacBook Pro and my Windows 10 desktop. Namely in Firefox, Chrome and Safari (all latest versions).
I understand the point of the “reduce motion” option, of course. However, I don’t use wild motion… but “only” a very smooth fade transition in the heroslider of my homepage.
Is there a way in Bricks to persuade the slider to autoplay, even with the “reduce motion” option enabled?
Here is a Link to my actual Testpage:
https://bricks.abresch-studio.de/
Hey, no need to cross post.
Yes, you’d need use the change options type setting to ‘custom’ and then manually add in all of your splide options as JSON, and change the reducedMotion option that i mentioned above. The splide option is ‘reduceMotion’, changing the autoplay to true would force it to play.
For eg, here’s the JSON in context with other options…
{
"type": "fade",
"autoplay": true,
"speed" : 400,
"reducedMotion": {
"autoplay": true,
"speed" : 400
}
}
If you have questions reg using custom options, you may want to start a new post.