I have an animation where I have a div block shrink to reveal a collection item image. However, I want the background color of the div to match the background color of the ACTIVE collection item. Since this div is nested within the collections list, if I check off "get BG color from [cms collection]) it will pull the color from the specific collection item and not the active collection page.
Is there a way to do this? I’m trying custom javascript but no luck, maybe the code is wrong? I also made sure I changed the div id on the div block I want to change. In the second screen shot the black box is what I want to match with the active background color. Anything helps!
So, I went and created a mock up of your idea, and it seems to work so…
I guess the part of ‘getElementById’ in your code is what breaks it.
You need to target ALL the divs, and ID is a singular element on a page. If you gave a div in a collection list an ID, it will probably brake the code.
Try ‘querySelectorAll’ and use classname.
@avivtech Hi Aviv! Thank you for your response. This is what I got from it. I think I might be inputing the code incorrectly? But I noticed that at least the background color is being captured in the code, but its just not applying on my .reveal-img class.
Here’s my read-only link if it makes things easier for you. Thank you so much for the help!