I am wondering how to prevent people from Save image as.. by right-click images on my webpages.
I was thinking about disable right-click, but it seems I have to write javascript code. Is there a easy way to do this?
The simple answer is "you cannot do that". You might be able to put something on the server side that will check the referer before serving the image, but even that is not 100% guaranteed. Moreover, even if you did manage somehow to prevent this, nothing would prevent somebody from taking a screenshot of the browser page and then cropping the image out of it.
I think a much better approach would be to have a server-side url rewriting and processing of the images to add some sort of a visible watermark identifying the images as owned by you and saving a proper copyright information in the EXIF information.
You can make a div that is the same size and height as the image and then you can set the image as the background for that div. That will prevent people from directly downloading the image but they can still enter the url and download it from there. I made a tutorial on this myself right here: http://www.andytechguy.com/tutorials/html/how_to_nodownload/
There's an easy solution for this which I used in my website. Just add oncontextmenu="return false;" attribute to the Image tag and you are done with it!
<img src="https://source.unsplash.com/random" alt="Random image" oncontextmenu="return false;">
This is my first question to be answered on stackoverflow, so please fair with me if I didn't use the right tools...
As long as the image URL is in the source code, the image is downloadable using the unix command wget, or anything similar. I'm not a javascript expert however, but I believe you could read the location of the photo from a text file instead of the URL being hard coded in the HTML. Then you could configure that text file to return a 403 (Permission denied) when attempted to view with whatever web server you are using. This still wouldn't stop screenshots though.
Something like this:
<img src="some javascript to read text file">
Then have the text file contain:
/path/to/obscurely/named/photo.png
Ya, this isn't really possible. Another option is to use Lightroom or something else to batch add watermarks. Watermarks are the only option that I'm aware of that will almost completely protect you, because even the screenshot idea is not really possible unless they are a wizard in Photoshop.
In conclusion I think Lightroom or something else is your best and easiest shot of getting what your looking for.
You can do this by converting the image format from jpg to svg...there are alot of converters online i.e https://convertio.co/jpg-svg/
After this you copy and paste the svg code into your html code to replace the jpg.
Related
I have a code which I need to share so I pasted in from Visual Studio Code into code pen and replace all my image links with imgur links but when I save the code on codepen it doesn't show up.
I've tried uploading to different picture sharing websites but none of them seems to work or sometimes they just dissapear
<img src="https://images.app.goo.gl/PH9vzQEL6deb152b7" alt="logo">
This is a simple code i used but the image just refuses to appear.
I just need to image to show up, if there is any way to share my website without publishing it to the web I would like to be informed about it too. Thanks you.
this is a website that get your image and give you base64 of it and you can put this base64 thing in your src attribute of img element and you are good to go
I'm running my processingjs sketch locally and I'm trying to save a PNG of my canvas but I can't get the regular commands saveCanvas("image", 'jpg'); and save("diagonal.tif"); to work.
Does anyone have a tip on how to get this done?
Cheers,
Thales
Questions like these are best answered by looking in the reference.
Take a look at the documentation for save() and saveFrame(). I'm not sure where saveCanvas() is coming from, but I don't see it in the Processing.js reference. Are you thinking of P5.js?
Anyway, the documentation says:
These files are saved to the sketch's folder, which may be opened by selecting "Show sketch folder" from the "Sketch" menu.
This makes me suspicious that these were only designed to be used from the Processing editor.
Take a look in your developer tools to check the JavaScript console for errors. What do you see when you try to call the save() or saveFrame() functions?
I'd also recommend googling "processing.js save image" for a ton of results, including:
save image to a png file using processing.js
How to export an image or PDF from a Processing Javascript mode sketch?
Processing.JS save() help
If you still can't get it working, please link to a CodePen or JSFiddle with a simplified MCVE that demonstrates the problem.
I need access to the image of the default clear button that apple provides because I want to use it somewhere else in my app, where can I find the image file? If apple doesn't allow access to them, does anyone have a link to this image, i've been searching for a while now and haven't found a proper .png image i can use (I don't have photoshop, so I can't edit them myself).
The image I'm talking about is the one that shows up if i add this line of code:
textfield.clearButtonMode = UITextFieldViewModeWhileEditing;
I suggest you to use this. http://www.teehanlax.com/tools/iphone/
It's a psd, but you should be able to extract the ressource using a tool like acorn.
Ok, I was feeling nice:
I have a Wordpress site (www.nurseresumetips.com) and I'm using a theme named JVPress.
This theme lets you to upload a custom header graphic. If you open the page in Firefox the header graphic displays, however when I open it in Internet Explorer 8 the image is not found.
The link that Wordpress is generating is: http://www.nurseresumetips.com/wp-content/uploads/20110419033853_nrt.jpg
This link works in Firefox but not in Internet Explorer.
I just want to know if anyone could point me in the right direction.
Thanks
Having looked around, I think you may be tripping over a problem like this, where your JPEG is encoded in a slightly odd format. Looks like CMYK is accepted as a format by some browsers, but not others.
Depending on your software, you might be able to find a way of saving in a more usual colour encoding -- in Photoshop, for example, try the specific "save for web" option.
Given the content of your image, I'd actually suggest saving the file as a PNG, anyway. JPEG is best for photographic images; for textual images like this one, PNG will probably (a) be more efficient, (b) look better -- no encoding artefacts around the nice solid lines you have, and (c) not have this odd problem you're facing.
I am using fckEditor as text editor. When i upload images thru it the images were uploaded to app/webroot/fckeditor/images.
And when they're embedded it looks like
/fckfiles/SalmonSashimi.jpg
Until now it looks right.
But the image doesn't appear.
So when I browse the image directly, at here
http://www.in-culture.info/fckfiles/SalmonSashimi.jpg
instead of displaying the URL, Cake interrupts the image call and trying to render it in a layout. I often face this error when I point .html file for iframe scroller and .xml file for flash embedding. This is really embarrassing
You can see the page here
http://www.in-culture.info/events/view/42
That image should appear before the text - "More" dont appear for short text.
Thanks for you help.
Try to change the path where the images are saved. Instead of
/app/webroot/fckeditor/images
try to change to
/app/webroot/img/fckeditor/
I believe that it's possible.
It's resolved now.
It was not cake's fault.
I pointed incomplete absolute path at FckEditor so it didn't upload the files well.
However the uploader mistakenly passes the "OK" so the HTML tries to display it.
So cake tries to render something, as usual, when there is no physical file.
I spent about 10 hours to resolve this.
Now I don't hate cake as I did a few hours ago. (: :)