In my angular application, I have a draggable div. Its parent is scaled down with CSS transform property. While drag the div, the cdk drag preview is not align with its parent's scaling. The div height and width gets back to its initial value which were available before parent scaling.
Asked
Active
Viewed 586 times
1
-
try adding the same transform.scale to the class `.cdk-drag-preview` – Eliseo Mar 11 '22 at 10:29
-
@Eliseo, tried this. But no hope ! – Harun Or Rashid Mar 11 '22 at 10:31
-
You can use a tecnica similar to this [SO](https://stackoverflow.com/questions/70590512/drag-and-drop-image-icons-using-angular/70761246#70761246), in `(mousedown)` you store the "style" and apply to the cdkDragPreview, but sadly, you loose the point when your mouse down (in the SO I use the margin-top and margin-left but this makes that if you has animated, when the element is "dropping goes to left before "re-allocated" ) – Eliseo Mar 11 '22 at 11:16
-
Apparently the preview element is attached to the body by default. You need to attach it to the `cdkDrag` parent with `cdkDragPreviewContainer="parent"`. – Ben Racicot Jan 09 '23 at 20:30