I’ve created an infinite marquee that displays a group of 10 corporate logos. The marquee scroll action works well and I think it looks good at the default desktop breakpoint. However, when I adjust to the smaller tablet and mobile breakpoints, the logos looks way too small. It would seem that I need to adjust the logo-wrapper divs by making them wider and taller but I’m not sure if I can do this without changing the marquee-block’s Size > Min W setting of 50%. The logo wrappers seem to me to be made bigger but there isn’t room and so they’re all being squeezed down. How does one handle this situation? Thanks!
Here is my public share link: Infinite Marquee
Hey @robertfdev, so working with percentages with marquees works great on large screens because 100% is full with of the screen right? however that sucks when it comes to mobile because 100% is just the width of your phone, and that is why the logos get so tinny. A quick fix for your marquee could be to make the marquee wrapper on phone landscape something like 350% instead of 200%? and like 450% on mobile portrait? that might fix the issue the way you have your interaction working. Another way to fix it, the long way, is to follow the same model you used but with different interactions for mobile devices. I hope this helps.
Thanks Pablo. I sort of discovered this today while playing around with my classes. Given that the logos are of varying sizes, I found it helpful to set the height in %s (and width Auto) at the desktop breakpoint and then switch to % widths and height Auto at the tablet and mobile landscape widths. At mobile portrait, the icons are really tiny so tomorrow I will experiment with setting widths of the logo wrappers to %s instead of pixels. That will make these wrappers wider and the logo %s will allow the logos to make maximum use of the space inside these larger wrappers.
Another thing which helped a lot was breaking the logos up into two rows instead of one. It still looks OK. You can even set one row to go in one direction and the other row in the other which looks kind of cool.
1 Like
As different techniques use for scale up images. As yesterday I saw a new method while studying it on youtube which is working very fine. But it also depend on your startup and classes. So kindly check different method from youtube and carefully select the one which work for you.