I have always been curious on how to do this... how do you make pictures un-draggable from your page?

(i.e) Somebody goes on my page and just drags my logos off my page.

So what do I do to in order to make an image "un-stealable".

Recommended Answers

All 11 Replies

To my knowledge there is no way to do this. You could disable right clicking for your site but someone can as easily just press "ctrl + u" and find the image location.

Not sure what you mean by "un-draggable", but I assume that you mean that you do not want anyone to be able to right click and save pictures from your site.

You can implement several things to make it more challanging for the user, but ultimately, i do not know of a way to make it impossible. You can disable the right click context menu, but the can use a variety of developer tools to view the source of the web page.

We can go through a list, but ultimately, the user can just take a snapshot of the screen and save the pictures.

JorgeM, that is another way of wording what I mean...

I know they can still take snapshots, but I don't want stealing images that easy for them (right click + save)....

So can you tell me how to do it anyway...?

Your avatar is from twitter...? Lol.

Just do a search for disabling the context menu in a web browser.

The source of the pictures will still be visible with the browser's dev tools. Disabling the right click ability isn't going to help much.

Yes, I did change my avatar into twitter :) Just to be a little goofy... next time i'll do Facebook... if they ever had a cool icon like twitter... (I used to have apple)

second, I know that even though i disable the right click ability it won't be 100% "bullet proof" but I rather have 80% people (those that know how to take images) blocked then have 100% being able to "mug" me...

Set images as background element or use HTML5 Canvas

I dont think you should consider working on such problem because whatever visible can be copied, Atleast I will not waste my efforts on something that works for only 15-20%. But it is just my opinion, its upto you good luck.

I thought maybe putting a div tag over the images would work... but then that will hide some of the capbilities like the logo (click it to go to home page)....

I know that people can still steal from me... but i don't it to be easy for thieves...

*don't want it to be easy

Try having a transparent div above your logo, but still as a developer you hide the overlapping div and take the image

hmmm..... placing transparent div tags about images... that seems clever and I know exactly how to do that! (I've done it before on accident on my menus)

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.