PDA

View Full Version : Disable Drag and Drop



???
12-23-2008, 08:31 PM
To be blunt: How do you disable drag and drop for an HTML Element? Specifically a DIV, but it shouldn't matter. I'm making buttons, and it would be kinda lame if people could drag them around... I could do a whole messy thing with an overlay div and pass the click and move events through to the buttons, but I'd rather not. If you want my code you can have it, but I don't think it's necessary.

Thanks,
Stephen

Nile
12-23-2008, 08:59 PM
What are you referring to? HTML elements aren't draggable.

???
12-23-2008, 09:29 PM
I have DIVs that have a dynamically changed background image and in FF I can drag them.

magicyte
12-23-2008, 11:53 PM
That's what I thought. I was going to point out that you can drag things in FF (most of the time, images). It is near impossible to disable this. Do you not want people to save your images? More info and as to why you want this is perfectly acceptable and wanted.

jscheuer1
12-24-2008, 05:23 AM
Please post a link to the page on your site that contains the problematic code so we can check it out.

???
12-24-2008, 04:08 PM
I don't have a site, I can give you the code, but I didn't think it'd be necessary. It's not that I don't want people to get my images, I'm all for having things available for everyone, but this is a button. It looks kinda lame if they can drag it, and it screws up my events.

jscheuer1
12-24-2008, 06:08 PM
It wasn't very clear what the trouble was. It still isn't. By default, there is no drag and drop. Some browsers allow you to drag and drop images to save them, but not to rearrange them on the page. As far as divisions go, they also may sometimes be able to be dragged around, but not dropped or even saved (at least not that I've ever seen). When doing so with images some browsers even show a slightly lighter representation of the image being dragged, as a visual cue that 'you have it' in your mouse's 'clutches'.

Now this may vary on other OS's, but in windows this may be prevented, at least in FF (the only browser that allows this anyway, and one of the few in which your code seems to work as intended) by:


window.onmousedown = function(e){
if(e && e.preventDefault)
e.preventDefault();
};

But none of this really hurts anything, and FF users expect to be able to do this, and generally won't unless they want to save the image, which can be done many other ways if this is disabled, so I would leave it alone.

This (below) however appears useless, and messes things up in Google Chrome (all others appeared to ignore it):


btns [id].ondrag = function () {
alert ("dragging");
return false;
}
btns [id].onenterstart = function () {
alert ("dragging");
return false;
}

???
12-24-2008, 09:43 PM
Hey, your right. It doesn't even work in IE. I guess I can just make an overlay. Well thanks.
Stephen