Klik met de rechtermuisknop op afbeeldingen met behulp van jQuery
In een van mijn vorige berichten, we al besproken hoe uit te schakelen Ctrl+U, CTRL+C, en klik met de rechtermuisknop op een webpagina, en de tutorial van vandaag is alles over hoe u met de rechtermuisknop uit te schakelen en te slepen op afbeeldingen met behulp van jQuery op een webpagina.
ik krijg vaak verzoeken van mijn bloggervrienden en klanten om de foto ‘ s op hun sites te beveiligen en te voorkomen dat mensen ze downloaden of opslaan. De meeste van hen willen dat ik de site bijwerken om te voorkomen dat gebruikers met de rechtermuisknop op de afbeelding klikken en Afbeelding opslaan of afbeelding slepen naar hun Computer of applicatie zoals Photoshop.
oké, maar waarom moet u met de rechtermuisknop klikken en afbeeldingen slepen in uw blog of website?
er is geen specifieke reden voor u om dit te doen. Persoonlijk raad ik niet aan om dit script te gebruiken om afbeeldingen met de rechtermuisknop uit te schakelen, omdat het de kwaliteit van de gebruikerservaring vermindert. Bovendien zou het zeer vervelend zijn voor veel gebruikers. Vergeet niet dat het belangrijkste doel van uw website is om waarde te bieden aan uw gebruikers.
zelfs als u bekend bent met een beetje jQuery en CSS selectors, kunt u het script bewerken om uit te schakelen of in te schakelen rechtsklik en sleep op elk soort HTML-element. U kunt met de rechtermuisknop op afbeeldingen met een speciale klasse van een bepaald onderdeel uitschakelen.
hoe voeg ik het script toe?
als u dit script aan uw blog wilt toevoegen, dan is hier een script dat u kunt gebruiken om met de rechtermuisknop op slepen op afbeeldingen uit te schakelen. Dit script werkt op basis van jQuery, maar de voorwaarde is dat uw blog moet een jQuery plugin geïnstalleerd. Zo niet, voeg dan de onderstaande jQuery plugin toe boven de < / head> tag in uw blog of website.
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>nu, het is tijd om de jQuery script dat met de rechtermuisknop te klikken en te slepen op afbeeldingen op uw blog website uit te schakelen toe te voegen. Het enige wat u hoeft te doen is het onderstaande script toe te voegen boven de </body> tag in de HTML van uw blog/website.
<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>dat is het. Bezoek nu uw website en probeer met de rechtermuisknop op een afbeelding en zie hoe dit script werkt!
Is er een andere manier om het te doen?
bovendien, hier is een andere manier die u kunt gebruiken om de rechtermuisknop op de afbeelding uit te schakelen met behulp van Javascript (Ja, Javascript. Niet jQuery). Als u niet wilt dat de bovenstaande jQuery script toe te voegen aan uw blog of wilt u alleen met de rechtermuisknop te worden uitgeschakeld en niet te slepen, er is een andere manier.
u kunt echter ook de sleepfunctie uit het bovenstaande script verwijderen, maar u kunt gewoon de onderstaande Javascript-code gebruiken die u moet plakken voor < / head> tag in de HTML van uw blog of website.
<script type='text/javascript'>//<!]></script>aanbevolen voor u:
hoe de selectie van tekst in een webpagina uit te schakelen met behulp van CSS