Relume
Log in

Community forum for knowledge and support

Updated 6 months ago

Interactions on a page with images in the wrong order

At a glance

A community member is having trouble with the layout of images in a section of their page. The last image is showing up on top of the others, and they are unsure if they should add the images in the opposite order. Another community member provides a possible fix in a Loom video, but there are still some issues. The community members try various solutions, such as adjusting the offset, adding back the background-holder, and reversing the order of the images. Eventually, they realize that they had deleted the background-holder animation, which was crucial, and they are able to fix the issue by starting fresh with a new component. The community members discuss the mystery of why the interaction works when scrolling back up, but they are glad to have resolved the issue.

Useful resources
EEmily Marais
·

Anyone able to take a look at the interactions on this page in the section under the header? I'm confused on how to set this up. The last image is showing up on top of all the others... Am I meant to add the images in the opposite order? (Layout 348)

Read-only

E
M
6 comments
EEmily Marais

Would really appreciate your help here. I'm useless when it comes to troubleshooting animations

MMatt Johnson

I would prefer to say inexperienced! I did a quick loom here with a possible fix but there's still a bit of mystery here. https://www.loom.com/share/5d5ed125e6b840cea77ccd74960c97c3?sid=046ebb98-c789-4e4e-be98-f8ca0f0a394c

EEmily Marais

Thank you! I have just:

  • Set the offset to 50% as on the original component
  • Added back in the background-holder
  • Removed the extra interaction trigger
It's still only working when I scroll down to the bottom and back up. It seems to be something up with the first image (South Africa), but I can't figure out how.

EEmily Marais

I tried reversing the order of the images in the DOM and the South Africa image sticks there the whole time. It feels like its interaction is broken somehow. I'm gonna start with a fresh component and see what I can do.

EEmily Marais

Wooooohoo it's fixed! I started fresh and realised I had also deleted the background-holder animation which must have been crucial. Thanks a million Matt!!

MMatt Johnson

ah yeah nice! But still the mystery of why it works just fine when you scroll back up - at least in my opinion thats a mystery but glad we got it resolved!

Add a reply
Sign up and join the conversation on Slack