drag-chan

A library to make HTML DOM elements draggable.

Usage no npm install needed!

<script type="module">
  import dragChan from 'https://cdn.skypack.dev/drag-chan';
</script>

README

drag chan

A library to make HTML DOM elements draggable.

Install

yarn add drag-chan

Example

<div class="box">
    <div class="box-drag-handle"></div>
</div>

import dragchan from 'drag-chan'

const box = document.querySelector('.box')
const boxDragHandle = document.querySelector('.box-drag-handle')
dragchan(box, boxDragHandle)

.box {
    position: relative;
    width: 100px;
    height: 100px;
    background: #ddd;
}

.box-drag-handle {
    position: absolute;
    width: 100%;
    height: 17px;
    background: #666;
    cursor: move;
}