W3C home > Mailing lists > Public > public-css-archive@w3.org > February 2018

Re: [csswg-drafts] [css-values] Trigonometric functions

From: Ana Tudor via GitHub <sysbot+gh@w3.org>
Date: Sat, 17 Feb 2018 20:06:09 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-366467799-1518897968-sysbot+gh@w3.org>
My primary use case is for syncing rotation angles and scale factors or translation distances when I animate multiple elements such that corners/ edges match throughout the animation.

In [this demo](https://codepen.io/thebabydino/pen/JNZGwE/), I need to sync the rotation angle of the bright yellow squares and the post-skew scale factor of the orange squares. This is done by doing the trigonometric computations in the JS and then setting the values to the custom properties used in the transform.

A way to do it all from the CSS would be immensely useful.

I can try to fake it with different timing functions for rotation angles and scale factors or translation distances as I did in [this demo](https://codepen.io/thebabydino/pen/ybExWm/), but that's just hardcoding the cubic-bezier() for every case.

-- 
GitHub Notification of comment by thebabydino
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2331#issuecomment-366467799 using your GitHub account
Received on Saturday, 17 February 2018 20:06:12 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:41:24 UTC