Le glisser-déplacer (drag-and-drop) en html5-javascript se programme en décomposant le traitement selon les étapes suivantes:

  1. utilisation de la propriété draggable pour rendre des objets déplaçables
  2. gestion des évènements de glisser-déposer du côté de la source (objet déplacé)
    • dragstart
    • drag
    • dragend
  3. gestion des évènements de glisser-déposer du côté de la cible (zone/objet recevant l'objet déplacé)
    • dragenter
    • dragleave
    • dragover
  4. gestion des types de déplacement (copie, déplacement (move), alias (lien)) et choix des données déplacées
    • se fait par l'intermédiaire de l'objet dataTransfer accessible, par exemple, par event.dataTransfer ou event est l'argument d'une callback utilisée pour gérer les évènements de glisser-déposer

Exemples