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

What is Framer? Join the Community
Return to index
Kevin Cannon
Posted Aug 28 - Read on Facebook

Hey guys - Didn't spot this elsewhere. Is there a nice way to do relative values? Right now I'm doing this, but it's great for reability.

properties {x : header.x+100}

9 Comments

Koen Bok

This is what I do too.

Kevin Cannon

Ahh. Shame there's no other way.
Some tweening libraries interpret strings as relative units. e.g. '+10' would be ab offset. Now idea how they technically do it. See transit for example, based on jQuery:
http://ricostacruz.com/jquery.transit/

Alex Hazel

use the style property in framer.js to set the CSS position property to "relative" while also wrapping the element in a superLayer with a position of "absolute"?

Kevin Cannon

I'm afraid you lost me :/

Alex Hazel

mySuperLayer.style = {
"position":"absolute"
}

myElement.style = {
"position":"relative"
}

myElement
properties:
superLayer=mySuperLayer

Now you have an absolutely positioned parent DIV with a relatively positioned DIV inside that wrapper.

My syntax might be a bit off but something like that

Kevin Cannon

Thanks for example, appreciate it. Think I'll stick with just adding it for now if possible.

Talking about superLayers though, is there a good explanation somewhere that talks about layers, superlayers, frames and views. Some stuff if pretty straightforward, but not understanding these concepts so well, and how they relate to each other.

Tisho Georgiev

You can actually do x: '+=100' in animation properties. '-=' is supported, too.

Koen Bok

How did I not know that? Is this a js artifact?

Tisho Georgiev

No, I added it and sent you a PR. You merged it in! :)

Read the entire post on Facebook