Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Dragging HTML Elements 2

Public visualization

Fork of Dragging HTML Elements 2

0 stars0🌍 Public
PPiotr Paszek
Last edited May 22, 2022
Created on May 22, 2022

This example demonstrates a drag-and-drop interface for organizing items into hierarchical collections, built with custom HTML elements and the HTML5 Drag and Drop API. Users can drag individual items or multiple selected items between containers, with items either moving or cloning depending on the source container. The interface includes collapsible collection groups, delete buttons, and buttons to save and restore connection states. Code uses custom elements (`vc-dragitem`, `vc-dragcontainer`, `vc-dragclosebutton`, `vc-dragdeletebutton`) and embedded SVG graphics inside draggable items.

AI-generated description

Comments

Sign in to join the discussion.

MIT Licensed