Hello everyone, I'm quite new to Framer and Coffeescript/Javascript. I've been playing around with the Scrollable template from the site and I've got the scroll working easily, but when I try to add a clickable animation to each photo to change the opacity it only seems to work on the bottom (3rd) image. I'm thinking my logic's off somewhere. Link: http://share.framerjs.com/lxyq5jj1yh30/ Wondering if anyone could help me? Thank you!

Lina Moon

Posted Dec 30 - Read on Facebook

Hello everyone, I'm quite new to Framer and Coffeescript/Javascript. I've been playing around with the Scrollable template from the site and I've got the scroll working easily, but when I try to add a clickable animation to each photo to change the opacity it only seems to work on the bottom (3rd) image. I'm thinking my logic's off somewhere.

Link: http://share.framerjs.com/lxyq5jj1yh30/

Wondering if anyone could help me? Thank you!

1 Comments

Marcelo Eduardo Oliveira

Hi Lina, simplest way to solve this on your version is to do :

for imageLayer in allLayers
imageLayer.on Events.Click, ->
@states.next()

modified version: http://share.framerjs.com/h94kwzeuvhua/

See that I replaced imageLayer with "@" symbol?
It represent "this" and in that way you make sure, each imageLayer will trigger the state.next() command correctly, instead of the last one.

You could also add the events on your main loop, using similar approach.

Read the entire post on Facebook