Prevent drag and drop

[ddurante]

Is there any way I can prevent prople from dragging and dropping my images onto their desktops? I was able to find html code for "no right click" but I can seem to find anything to prevent drat and drop.

If anyone can hep, it would be appreciated.

Thanks!

Diane

[tedster]

Hello ddurante, and welcome to the forums.

Drag and drop functionality is browser specific - so a scripted solution, if even possible, is going to be very labor intensive.

How about serving the images as a div's background image, and then fill the div with a transparent gif or png? That way the "real" image is still visible, but all the visitor can drag around is the transparency.

[edited by: tedster at 4:46 am (utc) on Feb. 1, 2009]

[lavazza]

For images at a satisfactory resolution (i.e. low but good enough) for on-screen viewing:

The short answer:

• No

The slightly longer answer:

• There are many, many scripts that purport/claim/pretend to 'protect' images but, for most they present little more than an annoyance and, for anyone with more than a smattering of net-sense, they don't work at all...
  
  So...

  No

[g1smd]

There's a meta to turn off the image toolbar in IE, but nothing much you can do to thwart the determined copier.

[shad0wsong]

There is a way to do it in javascript, but this is the year 2009 and it's silly to be still doing this kind of thing. Anything you serve up to the client is theirs to keep, legally or not.

now that im done complaining, here's the solution...

using javascript event handler, watch for the events 'dragstart' for ie and 'mousedown' for anything else on the images you don't them to be able to drag. trap the event and do something like return false on it.

event handling is a bitch, unless you're using a JS framework (Prototype, jQuery, MooTools, etc).

example in prototype:

img.observe('mousedown', Event.stop); 

img being the image object to stop the drag. To stop all images, either loop through "document.images" or use Element#delegate for Prototype:

document.delegate('mousedown', {'img': Event.stop}); 

[swa66]

No amount of javascript is going to stop a screen shot from being made of the browser showing the image.

It's a lost battle, no point in fighting it.

Watermark your pictures, keep them low res etc., or don't put them online if you can't stand them getting stolen.