Marquee Section no Longer Scrolling Animation
-
My marquee section (which uses <div>) is no longer functioning correctly. In the backend, I see the scroll animation. (Yes, the animation is toggled). However, when I visit the website, the scroll is static and the pictures are cut off.
Why is this no longer working?? I need a FIX not a Javascript code as this element is used in various pages on my website.
-
-
@marketing1b4feef1ff It was better if you posted the link along with your question but here’s a couple of things I’d check:
Check your operating system’s “Reduce Motion” settingThe most common cause of a marquee animation working in the WordPress editor but appearing completely static on the live front end is a system-level accessibility setting called “Reduce Motion.” When this is turned on in your operating system, browsers automatically stop CSS animations site-wide in response to it, including marquee scrolling effects. Importantly, the WordPress block editor backend often does not respect this preference the same way the front end does, which is exactly why you would see the animation running perfectly in the dashboard but frozen when you visit your actual site.
Here is how to check and temporarily turn it off for testing:
On Windows: Settings > Accessibility > Visual Effects > Animation Effects (toggle it on)
On Mac: System Settings > Accessibility > Display > uncheck “Reduce motion”
On iPhone/iPad: Settings > Accessibility > Motion > toggle off “Reduce Motion”
On Android: Settings > Accessibility > Remove animations (toggle off)
After changing the setting, do a hard refresh on your live site (Ctrl+Shift+R on Windows, Cmd+Shift+R on Mac) and check whether the marquee starts scrolling. If it does, that confirms this is the cause.
This does not mean anything is broken with your site. It means the animation implementation is correctly respecting accessibility preferences — it just happens to be catching you out as the site owner because you have that setting enabled for your own comfort.
If the animation is still static after turning off Reduce Motion
The second thing to check is whether a CSS conflict is overriding the animation on the front end. Open your browser’s developer tools (F12 or right-click > Inspect), click on the marquee element, and look in the Styles panel for any rule applying
animation: noneoranimation-play-state: pausedto that element or its parent container. A theme stylesheet or another plugin’s CSS can sometimes override animation properties. If you share your site URL here, someone can take a look and point to the exact rule.The images being cut off is a separate but related symptom. CSS marquees work by laying out duplicated content side by side and continuously sliding the whole track. If the animation is paused or stopped, the layout can appear broken because the container was not designed to display the content statically.
-
Reduce motion is already untoggled – not the issue.
I understand why the photos are being cut off – I only stated this because it is important we get this fixed as it looks bad for potential clients visiting the website. I’ve already inspected the site and can find no javascript errors. The website that is effected is here – https://www.garabedianproperties.com/
I am unable to show a recording in this thread, but if you scroll down on the site, it is the ‘portfolio’ section. Thank you for your response
-
We can’t help as that site isn’t running on the wordpress.com platform – https://wordpress.com/site-profiler/https://www.garabedianproperties.com
As you are using the Kadence blocks, you must contact their support.
WordPress.com Forums 