Contenu recommandé lié au glisser-déposer natif

Attribut dragable Nous avons déjà introduit plusieurs connaissances pertinentes sur le glisser-déposer natif en HTML5. Aujourd’hui, je vais vous présenter quelques autres petites choses du glisser-déposer HTML5. Sans plus tarder, jetons un coup d’œil ensemble. Par défaut, les liens, le texte et les images peuvent être déplacés, vous n'avez donc pas besoin d'écrire du code pour les faire glisser. Si vous souhaitez que d'autres balises d'éléments puissent être déplacées, seul HTML5 peut le faire. HTML5 spécifie l'attribut dragable pour tous les éléments HTML, indiquant si l'élément peut être glissé. L'attribut dragable est automatiquement défini sur true dans les balises de lien et d'image, et la valeur par défaut de l'attribut dragable des autres éléments est false. Les navigateurs qui prennent en charge l'attribut dragable sont : Firefox 4+, Chrome, IE 10+ et Safari 5+. Opera 11.5 et les versions antérieures ne prennent pas en charge la fonction glisser-déposer HTML5. De plus, pour permettre à Firefox de prendre en charge les attributs déplaçables, vous devez ajouter un gestionnaire d'événement ondragstart et enregistrer certaines données dans l'objet dataTransfer

1.Combat réel HTML5 et analyse du glisser natif (. quatre attributs déplaçables et autres membres)

Introduction : Nous vous avons déjà présenté plusieurs articles sur HTML5 Connaissance du glisser-déposer natif en Chine. Aujourd’hui, je vais vous présenter quelques autres petites choses en glisser-déposer HTML5. Sans plus tarder, jetons un coup d’œil ensemble.

2. Combat réel HTML5 et analyse du glisser-déposer natif (trois objets dataTransfer)

Introduction : Bien que le glissement natif soit implémenté via les événements dragstart, drag et dragend. Mais il ne s'agit que d'un simple glisser-déposer. Il existe encore des problèmes de glisser-déposer dans IE6 et IE7, et l'échange de données n'est pas implémenté. Afin de réaliser l'échange de données, IE5 a introduit l'objet dataTransfer. L'objet dataTransfer est une propriété de l'objet événement, utilisée pour transférer des données au format chaîne de l'élément glissé vers la cible de dépôt. Puisqu'il s'agit d'une propriété de l'objet événement, l'objet dataTransfer n'est accessible que dans le gestionnaire d'événements de l'événement glisser-déposer. Dans le gestionnaire d'événements, vous pouvez utiliser les propriétés et méthodes de cet objet pour compléter la fonctionnalité glisser-déposer.

3. Combat réel HTML5 et analyse du glisser natif (deux événements de glisser dragstart, drag et dragend)

Introduction : Grâce aux événements de glisser, nous pouvons contrôler le déplacement de beaucoup de choses. L'élément ou l'endroit où l'événement de glissement se produit est le plus critique. Certains événements sont déclenchés sur l'élément déplacé et d'autres sur la cible de dépôt. Lorsqu'un élément est déplacé, les événements déclenchés sont : l'événement dragstart, l'événement drag et l'événement dragend.

4. Combat réel HTML5 et analyse du glisser-déposer natif (aperçu de l'historique du glisser-déposer)

Introduction : Quand je parle de glisser-déposer, je pense à un effet très intéressant lors de l'entraînement JavaScript, à savoir le glisser-déposer. Vous pouvez utiliser la souris pour faire glisser un objet où vous le souhaitez.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!