I want to use my own SVG file in my HTML & CSS frontend project this way, but I couldn't get it to work. Can you help me?

Thanks so much for this

This might have something to do with what I'm trying to accomplish, trying to nest menu items inside a menu category (ie. Appetizers, all the appetizers). But no matter what I do, this never works, the items stay visible on the page in a long list, the nest-target and nest-source don't appear to do anything and I get absolutely nothing working. I just wish Webflow would expand this obvious error they've made in limiting the amount of categories that can be listed. It's extremely debilitating to making good websites.

Thank you so much ❤, you are a web bae indeed 😂

your tutorial was not helpfull your video like 2x speed

Hello, If an image ends up broken, does the uploader still get to 100%? thanks for the video

Hi, unfortunately i cannot access the free resources anymore

Precious help on this video. Very clear, works perfectly fine thank you so much for your time However, I was wondering how you would handle different VW (phones, tablets etc). Horizontal allows great experience on desktop, but I guess we should still stick to vertical scrolling when on smaller devices. How would you make it to switch from one to the other ? Also, I was wondering how you could let the mouspad scroll sideways. As of now, this animation works only with vertical scroll commands which could be unintuitive when the user notices it is horizontal scroll (in the case where there is no mix of vertical and horizontal scroll). Looking forward to your insight on that. Take care,

Pure talent.. Salute

thank u for "mouse move" guide

Your solid explanation on every statement demonstrates your skills and knowledge!

hhh The most weird flow i saw in my Dev life :)

this was amazing thank you so much!

I'm not sure why, but every single infinite marquee that I've ever built does the "snapping" thing randomly. You can observe this by pausing it and letting it sit for a bit. It will randomly jump and is kind of awkward.

Also, I'd really need a way to input an existing color as a starting point. Would definitely pay for that.

Now that Webflow added Variable Modes support, will you update the app to support them? Amazing work BTW 🙌

This is awesome! How do i change the background of the canvas?

Is it possible to control the duration and easing of the animations of the image and text?

Saved my life twice!

it's funny how a basic animation can be award winning. thanks for sharing

will this still work if I also have cms load more added to the collection? From what I remember if the items are limited because of the load more then the search function should only work with the ones currently visible as the others arent loaded in the dom yet. Is this true or does that not apply here?

Thanks for this clear explanation. Exactly what I was looking for.

Great video. Is there a way to add / show a query param/string with CMS items. Similar to what you've done here with filters, but with CMS items...

amazing stuff mate thank you:) just one question if i want to make the animation without active and inactive colors what to I need to Change? i removed (const ACTIVE_COLOR = `#ececec`; const INACTIVE_COLOR = `#414141`;) these 2 lines but the animation stopped working

Awesome vid

Easy to follow. Works like a charm. This is my kind of tutorial!

Thank you so much! it fixed my issue. Lovely

Very clever, thank you!!

Quick short and sharp thanks for this amazing video bro

can I put media in it? like making portfolio for it? because it's a hassle to make a several pages

Could not get this to work unfornatley. Any chance you could lend a hand? I'm in need of a Web Bae

thanks 🙏

For longer marquees, wider than 100vw, it would be nice if duration could be calculated on the width so you don't have to trial&error that value.

Confirming this works as of 12/15/24

Hey Keegan, I recently used this, so thank you, amazing tutorial and overview! Also, I noticed that even without using subgrid, the rows have a minimum height of 75px, which is only present in the designer and not in preview or published version. And, it can also be fixed by turning off the 'show empty elements' in the canvas settings (but that also means you cannot see an empty div on the designer as well). :)

Great video. I was trying to implament this for a group of photos that was wider than the screen width and kept running into an issue. seems like "const width = marqueeContent.scrollWidth;" correctly calculates the entire width of the div even if it overflows off screen. It also doesn't need a separate calculation for gap or padding. Not sure if there are any downsides when using it with smaller blocks of content.

Nice one...but how to decrease the space between the images... We set 1rem but its not really 1 rem its greater than that

Thank you so much! I did it!

Thank you, Web Bae. I tried recreating the animation using a straight line and was not getting the expected result. It turns out I needed to use <mask id="..." maskUnits="userSpaceOnUse">. I hope this may save someone out there some time.

Thank you! It's working as it should, no problems encountered

당신의 선한 영향력에 감사드립니다!!

Thank you for your great tutorial. If I want to add the marquee behind the text, should I put its position as "fixed" or "absolute" with a z-index: -1 ?

This works great but I notice the images are very low res on the live site while they are crisp in webflow. Is there any idea why that might be happening?

Thank u for make it so easy!

this doesnt work if you have masonry inside of webflow tab :(

is there a way to do this in CORS?

Isn't the DOMContentLoaded event listener redundant? At 2:14, the script is declared with type="module", which defers its execution. A deferred script runs only after the page has finished parsing?!

Anyone know how to remove constraints ?

what can I add to the code if I want it to explode after filling the screen, been stuck at this for a while.

Hi, as of now, Subgrid has a global usage of 90.54%. Is it safe to use in production, or what global percentage is generally recommended for using a CSS property?