More Premium Hugo Themes Premium Html Themes

Html5sortable

VanillaJS sortable lists and grids using native HTML5 drag and drop API.

Html5sortable

VanillaJS sortable lists and grids using native HTML5 drag and drop API.

Author Avatar Theme by lukasoppermann
Github Stars Github Stars: 1634
Last Commit Last Commit: Jun 10, 2024 -
First Commit Created: Aug 27, 2024 -
default image

Overview:

html5sortable is a lightweight vanillajs micro-library for creating sortable lists and grids using the native HTML5 drag and drop API. While it is community-maintained and not actively developed, it functions well with minimal issues. The library is only 2KB when minified and gzipped, has no dependencies, and supports both list and grid style layouts across various browsers.

Features:

  • Lightweight: Only 2KB when minified and gzipped.
  • HTML5 Drag and Drop API: Built using native HTML5 drag and drop API, no additional dependencies required.
  • List and Grid Layouts: Supports both list and grid style layouts for versatile usage.
  • Compatibility: Compatible with current versions of major browsers and IE11+ with a polyfill.
  • Module Formats: Available as ES6 Module, AMD, CommonJS, and iffe with a global sortable object.
  • Framework Adapters: Allows for the creation of adapters to integrate with frameworks like Polymer.

Installation:

  1. Install via npm: npm install [package-name]
  2. Load the desired file from the dist/ directory after installation:
    • iife: dist/html.sortable.min.js
    • ES6 Module: dist/html5sortable.es.js
    • CommonJS Module: dist/html5sortable.cjs.js
    • AMD Module: dist/html5sortable.amd.js
  3. For bower users: bower install https://github.com/lukasoppermann/html5sortable.git

Summary:

html5sortable is a versatile micro-library for creating sortable lists and grids using the native HTML5 drag and drop API. Despite being community-maintained and not actively developed, it offers a range of features including lightweight size, framework adapters, and support for various layout styles. Users can easily install it via npm and choose the appropriate module format for integration into their projects.