Is it Possible to Translate a 3D object w/o Translating the Object's Origin's Absolute Position Relative to the Global Page

[Darius Clarke]

Is it Possible to Translate a 3D object w/o Translating the Object's Origin's Absolute Position Relative to the Global Page?

For example, I've found an absolute position relative to the world that I'd like to pivot around. However, as I fine tune the object's translation relative to the global page, it's pivot (axis rotation) point moves with it. It's not a matter of copy and pasting it back in the CSS panel. I have to adjust the origin's values based on the delta values of the translation. 

Maybe a simple "shift-drag" gesture could perform this sort of manipulation. 

It would be nice if I could put a temporary formula in the CSS value, like a spreadsheet cell, which would be preserved in the editable version but only its current, calculated value is saved when published.

- Darius

[Nivesh Rajbhandari]

Hi Darius,

The transform-origin is specified relative to the left and top of the element. Thus, it will always move with the element.  https://developer.mozilla.org/en-US/docs/Web/CSS/transform-origin

However, you can manually move the transform-origin for the element at each keyframe to the global point you want to pivot around. You can do so by:

1. Select the element.
2. Switch to the 3d object rotate tool.
3. Click and drag the inner-ring of the rotate tool handles to a different location to change the transform-origin. Note that the transform-origin indicator (the inner-ring) will snap to other objects as well as to the stage's grid if you have that option turned on. You can place a dummy element at the coordinate you want to pivot around so it is easy to re-position the transform-origin by taking advantage of "Snap to elements" functionality.
   

Thanks,

Nivesh