Fixing Logo 3 Component Display Issues in Webflow
·
When I use the âlogo 3â component in Webflow, it doesnât display all the logos, and itâs not looping as expected. Any ideas on how to fix this?
When I use the âlogo 3â component in Webflow, it doesnât display all the logos, and itâs not looping as expected. Any ideas on how to fix this?
I also had some issues with this kind of set up and I don't like the solution from Relume, using webflow interaction. I build my own component with pure CSS for marquees. I thing this is a much better ans scalable solution with less ressource/less code. You will find a lot of videos building CSS marquees in YouTube
Thank you, I will take a look.
This issue was solved. I used right-to-left (RTL) direction in the settings, which caused the component not to work properly. Since this was a center-aligned component, I set the section to left-to-right (LTR) and adjusted only the text component to RTL. I also changed the logo section to LTR, and it now appears properly in the browser.
Hi Matt J., thank you for your answer. Both of the list are the same. Actually, I explained myself badly đ This element loops in the right way, but at some point it ends. There's a space gap and it starts again from the beginning. My client wants to have a seamless loop, without that gap, but i can't seem to find a solution. Here is the link (after the logo Banca Aidexa). thank you for your help
Hi Laura P. Iâd like to kindly share my opinion on this issue, but since Matt J. is the master expert here, Iâd also appreciate his input if Iâm mistaken. First, please note that the logo3_component should have a width of â200vwâ. It should contain two identical sets of content (the logos in this case). You have 12 logos, so each logo3_list should contain 12 components (one for each logo3_wrapper). Itâs important to set the grid of each logo3_list to 12 columns (currently itâs set to 6) and make sure the size of each grid item is 12.5rem. Next, youâll need to modify both interactions on the section_logo3: âą For the âScroll into viewâ and âPage loadâ triggers, adjust the âLogo 3 [Loop]â interaction. At the 0.00 mark, the X move should be set to -174rem. By applying these changes, youâll have a seamless loop. Lastly, please check the mobile view to ensure that you maintain the 12-column grid structure. In other words, the two lists will act like identical wagons on a moving trainâyou wonât notice their transition during the loop.
