Skills
.Work. You
Rest

gsap-draggable

Community

Make elements draggable and interactive.

Design & Creative#ui#interaction#animation#drag and drop#gsap#draggable
AuthorMicrock
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill enables interactive drag-and-drop functionality, inertia-based throwing, and precise control over element positioning and rotation, enhancing user engagement with web interfaces.

Core Features & Use Cases

  • Drag & Drop: Implement intuitive drag-and-drop for UI elements.
  • Inertia & Throwing: Add realistic physics for smooth, momentum-based movement.
  • Bounds & Constraints: Restrict movement within defined areas or to specific values.
  • Rotation & Snapping: Control rotational elements with precise snapping.
  • Use Case: Create a custom image slider, a draggable game piece, or a rotatable knob interface.

Quick Start

Use the gsap-draggable skill to make elements with the class 'draggable-item' draggable within their container.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: gsap-draggable
Download link: https://github.com/Microck/gsap-skills/archive/main.zip#gsap-draggable

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.