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

What is Framer? Join the Community
Return to index
Alex Bystrov
Posted Feb 14 - Read on Facebook

I'm working on a ux-proof of concept of an interface for splitting a payment into several fractions. I use sliders and input fields to set these fractions, but the sum of them obviously should remain equal to the initial payment. Here is the prototype I started to assemble: http://share.framerjs.com/6knlu8r5d28l/

I ran into several difficulties already though and wonder if someone could help me figure it out. Would really apreciate any help!

1) I found the JS implementation of the exact logic I need for the sliders https://jsfiddle.net/anoor/8fs0Lq4a/1/ but failed to implement it in my prototype

2) I use sliders[i].knob.on Events.DragMove instead of sliders[i].on "change:value" to move all the sliders except current one, but the problem with this is that it stops working when I move the finger too fast and it goes off the knob

3) I'm also wondering if there's a simple way to trigger anything when user edits one of the input fields. I'm using Andreas Wahlström's text module for the inputs.

4) I tried to access tabular figures but can't make it work as well
http://help.typekit.com/customer/en/portal/articles/1789736-syntax-for-opentype-features-in-css
Here is the css, but it's not working:
font-variant-numeric: proportional-nums;
-moz-font-feature-settings: "pnum";
-webkit-font-feature-settings: "pnum";
font-feature-settings: "pnum";