Drag Drop Tool
Draggable Elements Demo
To demonstrate the usage of the drag-container
and drag-box
elements, follow these steps:
- Create an HTML file (e.g.,
index.html
) and a CSS file (e.g., styles.css
) in your project.
index.html:
- include
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Draggable Elements Demo</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<drag-container>
<drag-box id="box1">Box 1</drag-box>
<drag-box id="box2">Box 2</drag-box>
<drag-box id="box3">Box 3</drag-box>
</drag-container>
</body>
</html>