Comment puis-je empêcher le glissement d'une image sur une page HTML ?

Désactivation du glisser-déposer d'images sur une page HTML

Lors de l'incorporation d'images dans des pages Web, il est souvent souhaitable d'empêcher les utilisateurs de les glisser-déposer. Cet article explore une solution qui résout ce problème.

Pour désactiver le déplacement d'une image, on peut utiliser l'événement ondragstart. En définissant cet événement pour qu'il renvoie false pour l'image spécifiée, le glissement est effectivement désactivé.

document.getElementById('my-image').ondragstart = function() { return false; };

Ce code attribue l'événement ondragstart à un élément HTML par son ID, dans ce cas mon-image. Lorsque l'utilisateur commence à faire glisser l'image, l'événement est déclenché et l'instruction return false empêche le comportement de glisser-déposer par défaut.

Pour ceux qui utilisent jQuery, une approche légèrement différente peut être utilisée :

$('img').on('dragstart', function(event) { event.preventDefault(); });

Ce code lie une fonction de rappel à l'événement dragstart pour tous les éléments sur la page. Lorsqu'une image est déplacée, jQuery appelle event.preventDefault() pour supprimer la fonctionnalité de déplacement.

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!