0Pricing
JavaScript Academy · Lesson

Visual Feedback During Drag

Style elements during drag operations.

Why Visual Feedback Matters

Good drag-and-drop tells the user what is happening: which item is moving, where it can land, and whether a drop is valid. Without feedback the interaction feels broken.

Styling the Dragged Item

Dim or scale the source on dragstart so the user sees what they picked up.

item.addEventListener("dragstart", () => item.classList.add("is-dragging"));
item.addEventListener("dragend", () => item.classList.remove("is-dragging"));

All lessons in this course

  1. Making Elements Draggable
  2. Drop Targets and dataTransfer
  3. Visual Feedback During Drag
  4. Dragging Files into the Page
← Back to JavaScript Academy