Created
June 9, 2025 14:38
-
-
Save withArtur/f6f0bc828bec436adcb98e392d90a469 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| # 🎯 Eventi di Drag and Drop | |
| ⚠️ **IMPORTANTE**: Gli eventi di drag and drop HTML5 **NON funzionano sui dispositivi mobile!** | |
| Su smartphone e tablet dovrai usare gli eventi `touch` o librerie specializzate. | |
| Gli eventi di drag and drop HTML5 non funzionano sui dispositivi mobile! | |
| È una limitazione importante da conoscere. | |
| Sui dispositivi mobile (smartphone e tablet) non esistono gli eventi dragstart, drag, drop, ecc. perché il paradigma di interazione è diverso - si usano i tocchi invece del mouse. | |
| Perché non funziona su mobile? | |
| ### I dispositivi mobile usano eventi touch invece degli eventi mouse/drag: | |
| `touchstart` - quando il dito tocca lo schermo | |
| `touchmove` - quando il dito si muove sullo schermo | |
| `touchend` - quando il dito si solleva dallo schermo | |
| ## Alternative per mobile | |
| 1. Librerie cross-platform | |
| La soluzione più semplice è usare librerie che gestiscono automaticamente sia desktop che mobile: | |
| SortableJS - ottima per liste riordinabili | |
| Interact.js - molto completa per drag and drop | |
| Hammer.js - per gesture touch | |
| 2. Implementazione manuale con eventi touch | |
| Ecco un esempio base di come implementare drag and drop che funziona sia su desktop che mobile: |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment