Hi,
Is there a way I could modify this code, so I can disable the right click, and have an alert message box on all my Lightbox images ?
https://codepen.io/herrberk/pen/yJJgJe
Thank you !!
1 Like
If you think that disabling right-mouse click is going to stop people saving your images, you are very much mistaken.
As @pauland says, if someone wants your images they can still easily get them.
It does deter the less tech savvy person though.
What you would need to do…
- is apply the classes to the Lightbox ID
lightbox-image - Add the attribute to the same ID.
oncontextmenu="window.alert('All Rights Reserved ©');return false;"
And that is straight forward with the exception that that ID only exists once you click on the image, so you will need to listen for that.
You would want to weigh up if it was worth doing all that for something that doesn’t secure your images at all.
Hi @pauland, I know how it works unfortunately, and I know that it won’t stop them. My goal isn’t to stop them, but to warn them with an original message instead.
Here is an exemple
https://www.florianbreitenberger.com/en
I think that people who might use images for commercial purposes will know how to access them and may not be put off, people who will only use right-click aren’t going to get any commercial advantage and probably just want a good picture for their desktop, so don’t cause any harm either.
You could watermark them.
I totally agree with you for some type of photos & companies 
But in my case, this is more local, for a ski area. It is just a reminder for businesses around to drop me an email is they’d like to use some of the photos. I’m more than happy to share them, depending on the purpose of course.
Hi @PeteSharp, thanks again for your time!
What about using a Bloc ID, and not the Lightbox ID then. And instead of a window.alert, having a fullscreen message like this following code… ?
How could I trigger the message from clicking anywhere in a bloc ?
HTML
<div class="content">
<div class="container">
<p>Copyright message</p>
CSS
/* Reset Layout */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
color: #fff;
font-family: sans-serif;
line-height: 1.5;
}
.content {
height: 100vh;
widht: 100vw;
position: relative;
background:rgba(0,0,0,.8);
}
.container {
width: 200;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}So you’re not concerned about the other stuff, just a copyright notice.
Yes, basically… a fullscreen copyright notice that would be triggered by doing a right click on a bloc
This is an interesting read.
1 Like
Great, thank you !
This is what I came out with, for the moment…
https://codepen.io/chrishsl/pen/LYpLPqa
I’m trying to hide the copyright message, with a left click now, but the script seems to work only once…
I think I have found a way easier solution, with style.display