Search the Community
Showing results for tags 'draggable rotation'.
Found 2 results
-
Hi Folks, In the attached pen I have a draggable element. Crossing a boundary (arbitrary left position of 300) the element is rotated 90 degrees. This all work correctly, however I have a couple of questions relating to the implementation and hoping someone might have some thoughts. 1) The element rotation is currently around transformOrigin "center center". If the drag is started with the mouse cursor off-center on the element, then after the rotation the element is separated from the mouse cursor. A preferred behaviour would probably be to move the element's center to the mouse position at the instant of rotation, or possibly translate the mouseposition into the transformOrigin. Is there an efficient way to achieve this that I've missed? Can I do a one time tween on the element to the mouse position that will not interfere with the active drag, or something similar? Do I have to revert to a "mouse follow" versus using draggable? 2) In this example I'm assigning the rotation on every on-drag iteration, which presumably isn't super efficient. Is there an optimal way to achieve this e.g. assigning an "isRotated" property to the item and checking that property before applying the rotation on each drag tick? Would the computation for that flag check (retrieve flag, test, assign if nescessary) be inherently more or less efficient that just assigning the rotation every drag tick? Many thanks as always! Shaun
-
Hi, I can get the end rotation with this onDragEnd:function() { console.log( Math.abs(this.endRotation%360)); } but how do I detect when the div stops spinning? Thanks,
