Get started with moveable CDN

MIT licensed

Moveable is a library for creating draggable and touch-friendly elements.

Tags:
  • moveable
  • resizable
  • scalable
  • draggable
  • rotatable
  • groupable
  • movable
  • warpable
  • pinchable
  • snappable
  • clippable
  • roundable
  • border
  • origin
  • dom
  • resize
  • scale
  • drag
  • move
  • warp
  • rotate
  • react
  • preact
  • throttle
  • group
  • pinchi
  • snap

Stable version

Copied!

How to start using moveable CDN


<!DOCTYPE html>
<html>
<head>
  <title>Get started with moveable CDN - cdnhub.io</title>
  <link rel="stylesheet" href="styles.css">
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/moveable.min.js"></script>
</head>
<body>
  <div id="draggable" class="draggable">
    <p>Drag me around!</p>
  </div>

  <script>
    const draggable = new moveable('#draggable', {
      origin: false,
      resize: false,
      parent: document.body,
      bounds: {
        minX: 0,
        minY: 0,
        maxX: 500,
        maxY: 500
      }
    });

    draggable.on('dragstart', () => {
      console.log('Drag started');
    });

    draggable.on('dragend', () => {
      console.log('Drag ended');
    });
  </script>
</body>
</html>
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!
Copied!

All versions