Hey there, running into some issues with banner 16 on mobile. In webflow preview, the animation and spacing look great, but when I check it on my actual mobile devices (ipad & iphone), the top row has some issues. The animation speed has increased, and the spacing between elements is huge. Bottom row is as expected. Any help would be appreciated 馃檹 Read only site here
Kaysha G. I think in your case you might want to delete the hide tablet combo class. In the original component each item was quite a bit longer, so to make the items show up on scroll more quickly, you would hide items and have less items total but still have the same animation cadence if that makes sense. Basically, you can only show so many items in the amount of time and scroll that a user would do on mobile so you will likely need to play around with that a bit.
That is what I did originally, but it had the same problem, which is why I tried adding those classes back in.
Just updated it to remove those, and can confirm the issue still persists 馃槩
yeah it looks like there are several edits here, which I understand why you made them, it should be possible
can you send the published URL?
I have this so far and it seems to act as it should on mobile device for me. https://matts-stellar-site-a6dc0e.webflow.io/ Can you check?
its setup almost identically to yours other than the actual images
yeah wild, yours is wildly different
Yeah yours seems to work. So weird. I really tried not to change much but something must be off. Do you have a read only link I can steal your version from?
what the settings should be Also looks like max height is set differently per breakpoint which again, I understand why, and it should be fine but you never know
In the top version, I haven't changed any of the styling, only added the photos and it's still behaving oddly when published vs in preview. Very confused
okay so maybe its the images, I see they are very large yeah?
yeah, they are fairly large. compressed to webp but still ~429 x 330px depending on the logo
hmm yeah I vaguely remember this issue with another Lumer...wish I had Mike Ross memory...hmmmm
got it
Remove the background from banner16_image-wrapper - thats a bug and we should remove that from the component. Add a max-width of 6rem to banner16_image-wrapper
you may need to play around with the interaction
I wouldn't necessarily mess with the interaction itself - just this smoothing setting. If you do need/want to play around with that interaction I would duplicate it and only check the box for Phone Portrait.
Thank you that's super helpful! I'll mess about with it 馃檪
Got it working and looking cute again! Thanks for all the help! I would have been pulling my hair out for hours 馃珷 snakesxladders.com
woohoo! Awesome website by the way - great job!