So deaktivieren Sie den Rechtsklick auf Bilder mit jQuery
In einem meiner vorherigen Beiträge haben wir bereits besprochen, wie man STRG + U, STRG + C und Rechtsklick auf eine Webseite deaktiviert, und im heutigen Tutorial geht es darum, wie man Rechtsklick deaktiviert und Bilder mit jQuery auf einer beliebigen Webseite zieht.
Ich bekomme oft Anfragen von meinen Bloggerfreunden und Kunden, die Fotos auf ihren Websites zu sichern und zu verhindern, dass Personen sie herunterladen oder speichern. Die meisten von ihnen möchten, dass ich die Website aktualisiere, um zu vermeiden, dass Benutzer mit der rechten Maustaste auf das Bild klicken und das Bild speichern oder auf ihren Computer oder ihre Anwendung wie Photoshop ziehen.
Okay, aber warum sollten Sie die rechte Maustaste deaktivieren und Bilder in Ihrem Blog oder Ihrer Website ziehen?
Es gibt keinen besonderen Grund für Sie, dies zu tun. Persönlich empfehle ich nicht, dieses Skript zum Deaktivieren von Rechtsklick-Bildern zu verwenden, da dies die Qualität der Benutzererfahrung verringert. Darüber hinaus wäre es für viele Benutzer sehr ärgerlich. Denken Sie daran, dass der Hauptzweck Ihrer Website darin besteht, Ihren Nutzern einen Mehrwert zu bieten.
Selbst wenn Sie mit ein wenig jQuery- und CSS-Selektoren vertraut sind, können Sie das Skript bearbeiten, um das Klicken mit der rechten Maustaste zu deaktivieren oder zu aktivieren und auf jede Art von HTML-Element zu ziehen. Sie können den Rechtsklick auf Bilder mit einer speziellen Klasse einer bestimmten Komponente deaktivieren.
Wie füge ich das Skript hinzu?
Wenn Sie dieses Skript zu Ihrem Blog hinzufügen möchten, finden Sie hier ein Skript, mit dem Sie den Rechtsklick beim Ziehen von Bildern deaktivieren können. Dieses Skript basiert auf jQuery, aber die Bedingung ist, dass in Ihrem Blog ein jQuery-Plugin installiert sein muss. Wenn nicht, fügen Sie das folgende jQuery-Plugin über dem < / head> -Tag in Ihrem Blog oder Ihrer Website hinzu.
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>Jetzt ist es an der Zeit, das jQuery-Skript hinzuzufügen, das das Klicken mit der rechten Maustaste und das Ziehen von Bildern auf Ihrer Blog-Website deaktiviert. Alles, was Sie tun müssen, ist das folgende Skript über dem < /body> -Tag im HTML-Code Ihres Blogs / Ihrer Website hinzuzufügen.
<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>Das war’s. Besuchen Sie nun Ihre Website und versuchen Sie, mit der rechten Maustaste auf ein Bild zu klicken, um zu sehen, wie dieses Skript funktioniert!
Gibt es eine andere Möglichkeit, dies zu tun?
Hier ist eine weitere Möglichkeit, mit der Sie den Rechtsklick auf das Bild mithilfe von Javascript deaktivieren können (Ja, Javascript. Nicht jQuery). Wenn Sie das obige jQuery-Skript nicht zu Ihrem Blog hinzufügen möchten oder nur mit der rechten Maustaste klicken und nicht ziehen möchten, gibt es einen anderen Weg.
Sie können die Drag & Drop-Funktion jedoch auch aus dem obigen Skript entfernen, aber Sie können einfach den folgenden Javascript-Code verwenden, den Sie vor dem </head> -Tag in den HTML-Code Ihres Blogs oder Ihrer Website einfügen müssen.
<script type='text/javascript'>//<!]></script> Empfohlen für Sie:
So deaktivieren Sie die Auswahl von Text auf einer Webseite mithilfe von CSS