designMode : Démo HTML5
Mise à jour : 2017-01-22
designMode
- on : le document est éditable.
- off : le document n'est pas éditable.
Notes sur le tuto
- Il peut être intéressant de l'utiliser avec execCommand.
- Limitations :
- Les boutons ne sont pas éditables, sauf par IE.
- Pour sortir du mode d'édition utilisez le bouton "designMode Off", équivalent sous IE au menu contextuel "Mode Navigation".
- IE nécessite un double-click pour passer en mode d'édition.
- Edge n'a pas les spécificités de comportement de IE.
Exemple de code HTML5
<script> document.designMode = "on"; </script> Vous pouvez modifier tout le document et même déplacer les images. <input type="button" value="designMode Off" onclick="document.designMode='off'"/>
Démonstration du résultat HTML5
Vous pouvez modifier tout le document et même déplacer les images.
Détection automatique du support HTML5
Librairie JavaScript de détection automatique (attention, comporte quelques faux positifs et faux négatifs)<script src="_html5detect.js"></script> <script>isItemSupported("document.designMode", false, "on")</script>