Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: MiguelCanellas en 15 Septiembre 2020, 06:50



Título: [Pregunta]: Desactivar click derecho en imágenes.
Publicado por: MiguelCanellas en 15 Septiembre 2020, 06:50
Hola,

¿Como podría desactivar el click derecho cuando se le está haciendo a una imagen? Es que quiero que a los usuarios se les resulte más difícil descargar imágenes desde mi aplicación web. (Entiendo que evitar al 100% es imposible, pero de todas formas para limitar al usuario común MESSIrve  :xD)

Estuve viendo varios temas pero siempre es lo mismo, te terminan diciendo como desactivar el click derecho a nivel general cuando yo solamente quiero desactivarlo cuando se le hace click derecho a una imágen.

¿Alguna idea?

Gracias.


Título: Re: [Pregunta]: Desactivar click derecho en imágenes.
Publicado por: Drakaris en 15 Septiembre 2020, 15:05
Buenas, la funcion que tienes que usar es preventDefault()

Citar
If this method is called, the default action of the event will not be triggered.

En el addlistener() o en on(), depende de si usas javascript o Jquery, debes de poner evento tipo contextmenu

Código
  1. <!DOCTYPE html>
  2. <html>
  3. <body>
  4.  
  5. <img src="https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png" id="image">
  6.  
  7. <script>
  8. document.getElementById("image").addEventListener("contextmenu", function(event){
  9.  event.preventDefault()
  10. });
  11. </script>
  12.  
  13. </body>
  14. </html>
  15.  

Código
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  5. </head>
  6. <body>
  7. <img src="https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png" id="image">
  8.  
  9. <script>
  10. $(document).ready(function(){
  11. $("#image").on("contextmenu",function(event){
  12.     event.preventDefault();
  13.    })
  14. })
  15. </script>
  16.  
  17. </body>
  18. </html>
  19.  
DOC: https://developer.mozilla.org/es/docs/Web/API/Event/preventDefault
DEMO: https://www.w3schools.com/code/tryit.asp?filename=GIRN368E2XM7

Enlace de interés: Como evitar mostrar el inspeccionador de elementos:
https://es.stackoverflow.com/questions/50436/ocultar-c%C3%B3digo-html5-php-de-una-web


Título: Re: [Pregunta]: Desactivar click derecho en imágenes.
Publicado por: MiguelCanellas en 15 Septiembre 2020, 20:44
¡Muchas gracias, me sirvió perfecto!