You Can't Find a Better Infinite Marquee

I just updated the cloneable with fixes for published mobile sites: For images: set loading to eager and width to 100%. Minimize extra content within the content div. For text just minimize extra content in the content div. Thanks Jake for your comment.

Genius!!!!!! Thanks 🙏

im getting skipps. what might that be?

How do you remove the gap between the marquee content blocks?

That was really useful thank you. 😇

sorry I am slow, do you have the html text I can copy and I will make changes as I go

I love css-only solutions.

Wow!!! Thank you Web Bae!

Thank you for the video. I have a question. Everything works great on desktop and even the mobile preview in web flow but whenever I publish it, all of my logos seem to be extremely far apart only in Mobile. I did your solution but they just seem to be so far apart from each other. Any idea why? I tried to join the discord but the link is invalid

Thank you so much for taking the time to not just show the code but create a blog write up explaining your technique. I just could not wrap my mind around the concept until I found your video lol thank you!

Hello, thank you for this video. There is one problem I am having where the marquee flickers when transitioning on Firefox and Safari but works fine on Chrome. Do you know what could be causing this and how I can fix it?

I tried to add more than 2 marque-content but it doesn't work :(

This is great, only thing is I get a gap between marquee content blocks, and second one just appears in the middle. Discord invite expired, any other way I get some help? Thanks! 🙏

For some reason, the first 5 or 6 logos in my marquee don't smoothly come into view from off screen, where you can see the whole logo move into view. Instead they sort of blink in. Any ideas what's going on? Thanks

Thank you!

Does this work with Showit too? And if so, where do I add the text I want as an infinite marquee?

Absolutely amazing tutorial. I managed to translate this into my Shopify page as our company is changing the theme and could follow is flawlessly. Thank you for your contribution!

Great video. Thanks my man.

Wow. Great video my friend.

Agree, this is the best one)

Thank you!

Apologies late to the party here! Thanks for this great marquee! Is it possible on mobile to make it animate slightly faster? Let me explain I've I've got 5 logos scrolling and 5 other in reverse and its set to '20s' and it works perfectly on desktop and tablet at that speed but on mobile portrait and landscape it slows to a snail's pace? :( Is it something I'm doing?

from where you add scroll combo class?

Hey bro, whenever I swap my logos for the ones I want to use, the marque starts skipping, leaving a big gap then skips to the beginning again! Any ideas?

GENIOUSSSSSSSSSSSSSSSSSSSSSSSSSSSSSS

There a big uneven gap in between the text.

Works great!!

Works perfect! Thanks!

total bs

Hi Web Bae, amazing tutorial thank you very muhc for your content. How can i rotate the marquees without having them cutted? Thanks again keep up with your good work.

Thank you so much! you gained a new subscriber

Great work man!
Any tips on how to do this using a CMS collection?
Thanks dude.

Yes, but how do you get it to tilt like in the thumbnail?
My guess is that you will need to be able to extend the edges past the VW and then add your rotation.

Very nice! I like this setup for a basic marquee, but if you want mouse interrupts where you can pause it when mouse enters and scroll with trackpad, I need a more advanced solution.

I get glitches when I change the speed (% in the embed). Any ideas man? Thanks dude! Flex GAPS are both set to 1.

You saved me, thanks man. I'm currently doing a pro-bono project with other passionated guys in Italy. We are trying to make a change in the system of education (even small). I needed so bad this tutorial. You may have indirectly contributed to a great cause ❤

Do this work with wordpress?

That's the actual marquee that worked for me ! Thanks!

If you want two marquees on the same page scrolling in opposite directions, give the marquee content in the second marquee another combo class of "reverse" and add this to the embed:

.reverse {
animation-direction: reverse;
}

Thanks for the amazing tutorial. Any major difference you noticed between this and the GSAP one?

Hey! Thanks for the video. Just have a question: if I have several marquees, how can I make one of them scroll in the opposite direction?

why does it blink from time to time? i see the blinking on the clone project also

Very nice tutorial, easy to follow. And yes, I do change text color instead of background all the time and then wonder why it is not working haha

How do i add more images? it overlaps all the time?

Thanks for sharing! Is it possible to change the speed? Feels a little quick currently.

Does this work with a collection list? I've tried about 5 different solutions and none of them seem to...

Thanks for the awesome vid man! Everything works except on my puplished mobile site, logos are randomly disappearing at times. Not sure if you have any advice or have seen this before? Cheers

This is Absolutely the Best