daybrush / scenejs

🎬 Scene.js is JavaScript & CSS timeline-based animation library

Home Page:https://daybrush.com/scenejs

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Scenejs + react-moveable + CSS transform-origin + transform (with translate and rotate)

rm-vt opened this issue · comments

Environments

"react": "^18.2.0",
"scenejs": "^1.10.3",
"react-moveable": "^0.56.0"

Description

In the below clip,
I am not able to find what is causing the target 1 element to move away from its origin - specifically between 2 to 3 to 4 keyframes.

Is this anything to do with transform property's order of precedence between translate, rotate, transform-origin?

You can see the exact values from the dev tools for your reference.

Thanks @daybrush

scenejs+react-moveable-css-transform-origin-issue.webm