This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Atulesh Bhardwaj
Posted Jan 09 - Read on Facebook

Hi all, I am a total novice to coffee, js or framer, but since i like it a lot, I am trying to learn as much as i can. I am facing 3 issues in prototype i am doing for a project. This is a similar layout to share with you.

1. The feed list when scroll vertically upward, the topbar background needs to appears with a fade. And fades out when list goes down at initial state. Problem is I am not able to execute it correctly.

2. The top image layer, will expand if the feed is dragged below and will behave similar to google+ when scrolled up, i.e parallax. Don't know how to do that.

3. I am trying to make the first feed item, that has a circular blob on top (depicts as 4-5 horizontal cards) a left-right swipe-able cards. Problem is, that the cards are getting cut, whereas in the sketch its alright.

Framer file I am working on: http://goo.gl/e3LqQO
Sketch file if you need: https://goo.gl/1K0LYW

Help highly appreciated. Thanks

4 Comments

Blaine Billingsley

Hey Atulesh, i am certainly no coffee script expert but let me see if I can get you in the right direction: 1 - Try using Utils.modulate to do what you are looking for. Something like topBarOpacity = Utils.modulate(scroll.scrollY, [0, 200], [0, 1], true)
sketch.topbar.opacity = topBarOpacity

Blaine Billingsley

2. I'm not sure I understand exactly what you are going for here. Could you try explaining it a different way?

Blaine Billingsley

3. The sketch import is cutting them off at the artboard. Try moving them completely on the artboard and then laying them out offscreen after you are in Framer.

Blaine Billingsley

I did a quick version of these to help get you started: http://share.framerjs.com/qnxkba9xv5i2/

Read the entire post on Facebook