diff --git a/src/DragContainer.vue b/src/DragContainer.vue index 6c2b6441dc6bd9fbdf268e9a8e0cd19aafadce7f..25eaaeb9bb24374795c6c0ab5706f724f4759bd4 100644 --- a/src/DragContainer.vue +++ b/src/DragContainer.vue @@ -31,10 +31,13 @@ export default { mouseX: event.clientX - rect.x - rect.width / (2 * this.w), // relative to center of the top left square mouseY: event.clientY - rect.y - rect.height / (2 * this.h), }; + // Now the element is on top of everything else inside the grid (not on top of other grids though) + this.zIndex = 999999; }, handleDragEnd() { this.offsetX = 0; this.offsetY = 0; + this.zIndex = "auto"; }, handleDragMove(event) { this.offsetX += event.dx; @@ -108,6 +111,7 @@ export default { dataTransfer: {}, offsetX: 0, offsetY: 0, + zIndex: "auto", }; }, }; @@ -123,5 +127,6 @@ export default { calc(1px * v-bind(offsetX)), calc(1px * v-bind(offsetY)) ); + z-index: v-bind(zIndex); } </style>