In today’s video we are going to build an infinite marquee with stop on hover, an attributes-only solution with a focus on motion accessibility. And it also works with Webflow CMS.
We'll talk about marquees, attributes, motion accessibility, CSS media features, and paused animations. And we'll do that by using a whiteboard. 😁
If you liked the video, feel free to hit the like button and subscribe to my channel. And if you have any suggestions about future videos or things I can improve, share a comment below! 😁
*********
UPDATES:
Added 2 new values for the "direction" attribute: "horizontal-reversed" and "vertical-reversed"
Added default values for both "direction" and "duration" attributes ("horizontal" and "120", respectively)
*********
Live link to infinite marquee with stop on hover:
https://webflow-friendly-components.w...
Link to Webflow Friendly Components cloneable:
https://webflow.com/made-in-webflow/w...
My Webflow public profile:
https://webflow.com/@francescocastro
Weekly Recommendation: SUPER BEAVER feat. Haruko Nagaya - Tokyo
• Uru - それを愛と呼ぶなら / THE FIRST TAKE
*********
We can talk on LinkedIn:
/ francescocastronuovo
Or we can get to know each other on Twitter:
/ francescoflow
*********
0:00 Intro
0:40 Infinite marquee with stop on hover at the whiteboard
4:36 Building the structure of the marquee in Webflow
10:45 Adding attributes to build the animation
17:18 Adding a simple animation on hover
20:46 Quick note on responsiveness
21:42 Outro
#webflow #madeinwebflow #nocode #attributes #accessibility
On this page of the site you can watch the video online Webflow No Code Infinite Marquee With Stop On Hover | Attribute Solution with a duration of hours minute second in good quality, which was uploaded by the user Francesco Castronuovo 22 February 2023, share the link with friends and acquaintances, this video has already been watched 6,906 times on youtube and it was liked by 236 viewers. Enjoy your viewing!