Drag & Drop Hotbar example

Important

Drag & Drop Hotbar example is an example that can be used as a basis for other projects. It uses jQuery UI v1.14.1 & jQuery v3.7.1 as a local file.

This project was created on a personal basis for another inventory project on FiveM. You can move items into a hotbar, specifying the quantity or not, and then retrieve the data in the back-end you want (not present here).

Important

The top part with the various “Rename” and “Use” buttons, as well as the clothes, is not functional on the demo, as it was made for the FiveM project, but it's easy enough to make it work the way you want.

DEMO

A demo is available at jordqn.fr/drag-and-drop-example.

USAGE

1. Clone the project on your local computer.

git clone https://github.com/Xari0x/drag-and-drop-example.git

2. Modify script.js, style.scss and index.html as required, depending on the use case.
3. Compile the SCSS style file.

sass style.scss style-min.css

4. Open index.html and admire the result.

TOOLS

• Visual Studio Code
• SASS

UPDATES

• 1.0.0
  • initial release.