L'attribut universel draggable est un attribut à valeur contrainte qui indique si l'élément peut être déplacé avec la souris dans un geste de glisser-déposer lorsqu'on utilise l'API Drag & Drop. Les valeurs autorisées pour cet attribut sont les suivantes :

  • true : qui indique que l'élément peut être déplacé à la souris
  • false : qui indique que l'élément ne peut pas être déplacé à la souris

Si l'attribut n'est pas défini, la valeur par défaut sera auto : le comportement de l'élément sera celui spécifié par défaut par le navigateur.

Cet attribut est un attribut à valeur contrainte, ce n'est pas un attribut booléen. Il faut donc utiliser une valeur explicite true ou false. La notation raccourcie (utilisant uniquement le nom de l'attribut) ne fonctionnera pas :

<label draggable>Label exemple</label>

En revanche, on pourra correctement utiliser :

<label draggable="true">Label exemple</label>

Par défaut, seules les sélections de texte, les images et les liens peuvent être déplacés à la souris. Pour les autres éléments, il faudra définir le gestionnaire d'événements pour ondragstart afin de faire fonctionner le glisser-déposer. Cela est illustré dans cet exemple.

Spécifications

Spécification État Commentaires
HTML Living Standard
La définition de 'draggable' dans cette spécification.
Standard évolutif Aucune modification depuis la dernière dérivation de HTML 5.1
HTML 5.2
La définition de 'draggable' dans cette spécification.
Recommendation Aucune modification
HTML 5.1
La définition de 'draggable' dans cette spécification.
Recommendation Dérivation de HTML Living Standard, définition initiale.

Compatibilité des navigateurs

Update compatibility data on GitHub
OrdinateurMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariWebview AndroidChrome pour AndroidEdge MobileFirefox pour AndroidOpera pour AndroidSafari pour iOSSamsung Internet
Support simpleChrome Support complet OuiEdge Support complet OuiFirefox Support complet 2IE Support complet OuiOpera Support complet 12Safari Support complet OuiWebView Android Support complet OuiChrome Android Support complet OuiEdge Mobile Support complet OuiFirefox Android Support complet 4Opera Android Support complet OuiSafari iOS Support complet OuiSamsung Internet Android ?

Légende

Support complet  
Support complet
Compatibilité inconnue  
Compatibilité inconnue

Voir aussi

Étiquettes et contributeurs liés au document

Contributeurs à cette page : SphinxKnight
Dernière mise à jour par : SphinxKnight,