Re: [csswg-drafts] [css-values] [css-fonts-4] Native map() function in CSS

I feel like this is doing two different things. If we break this down 
into its component parts, it:

1. Determines where the viewport lies between two bounds
2. Uses that result to map to value between two other bounds

It would seem more generally useful to me if we could split those two 
concerns apart. For the second part, what if it just took a number 
from 0 to 1.0 & did the calculation based on that. Then, assuming a 
syntax something like `map(<min-value>, <max-value>, <scale-value>, 
[<easing>])`, it could help out more generally in all sorts of use 
cases:

```
--value = 0.3;
color: map(red, blue, var(--value), ease-in);
```

...At this point, it's not all that different from a keyframe 
animation, but the value acts as a way to "scrub" through the 
animation, or pause it at a specific point. (Is this sort of thing 
already possible w/ keyframes, in pure CSS, or would it require JS?)

The other piece of the puzzle would be constructing that value from 
the viewport. As you said, this can be done with `calc()`, but some 
sort of shorthand wouldn't hurt.

-- 
GitHub Notification of comment by keithjgrant
Please view or discuss this issue at 
https://github.com/w3c/csswg-drafts/issues/581#issuecomment-252653925 
using your GitHub account

Received on Monday, 10 October 2016 15:18:47 UTC