Comment Désactiver le Clic Droit sur les Images à l’aide de jQuery

disable-right-click-on-image-jquery

Dans l’un de mes articles précédents, nous avons déjà discuté de la façon de désactiver CTRL + U, CTRL + C et un clic droit sur une page Web, et le tutoriel d’aujourd’hui explique comment désactiver le clic droit et faire glisser des images à l’aide de jQuery sur n’importe quelle page Web.

Je reçois souvent des demandes de mes amis blogueurs et de mes clients pour sécuriser les photos sur leurs sites et empêcher les gens de les télécharger ou de les enregistrer. La plupart d’entre eux veulent que je mette à jour le site pour éviter le clic droit des utilisateurs sur l’image et enregistrer l’image ou faire glisser l’image sur leur ordinateur ou leur application comme Photoshop.

D’accord, mais pourquoi devriez-vous désactiver le clic droit et faire glisser les images sur votre blog ou votre site Web?

Il n’y a aucune raison particulière pour vous de le faire. Personnellement, je ne recommande pas d’utiliser ce script pour désactiver le clic droit sur les images car cela diminue la qualité de l’expérience utilisateur. De plus, ce serait très ennuyeux pour de nombreux utilisateurs. N’oubliez pas que l’objectif principal de votre site Web est de fournir de la valeur à vos utilisateurs.

Même si vous connaissez un peu les sélecteurs jQuery et CSS, vous pouvez modifier le script pour désactiver ou activer le clic droit et faire glisser tout type d’élément HTML. Vous pouvez désactiver le clic droit sur les images avec une classe spéciale d’un composant particulier.

Comment ajouter le script ?

Si vous souhaitez ajouter ce script à votre blog, voici un script que vous pouvez utiliser pour désactiver le clic droit sur le glisser sur les images. Ce script fonctionne sur la base de jQuery, mais la condition est que votre blog doit avoir un plugin jQuery installé. Sinon, ajoutez le plugin jQuery ci-dessous au-dessus de la balise </head > dans votre blog ou site Web.

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

Maintenant, Il est temps d’ajouter le script jQuery qui désactivera le clic droit et le glisser-déposer sur les images sur le site Web de votre blog. Tout ce que vous avez à faire est d’ajouter le script ci-dessous au-dessus de la balise < /body > dans le code HTML de votre blog / site Web.

<script type="text/javascript">$(document).ready(function(){// this part disables the right click$('img').on('contextmenu', function(e) {return false;});//this part disables dragging of image$('img').on('dragstart', function(e) {return false;});});</script>

C’est tout. Maintenant, visitez votre site Web et essayez de cliquer avec le bouton droit de la souris sur n’importe quelle image et voyez comment fonctionne ce script!

Existe-t-il un autre moyen de le faire?

De plus, Voici une autre façon que vous pouvez utiliser pour désactiver le clic droit sur l’image en utilisant Javascript (Oui, Javascript. Pas jQuery). Si vous ne souhaitez pas ajouter le script jQuery ci-dessus à votre blog ou si vous souhaitez que le clic droit soit désactivé et ne fasse pas glisser, il existe un autre moyen.

Cependant, vous pouvez également supprimer la fonction de désactivation du glisser du script ci-dessus, mais vous pouvez simplement utiliser le code Javascript ci-dessous que vous devez coller avant la balise </head > dans le code HTML de votre blog ou site Web.

<script type='text/javascript'>//<!]></script>

Recommandé pour vous:
Comment désactiver la sélection de texte dans une page Web en utilisant CSS

Leave a Reply

Votre adresse e-mail ne sera pas publiée.