Why is my custom drag and drop script failing?
I am currently trying to code my own JS drag and drop script (out of sheer curiosity and boredom, I know it will be much easier with a wireframe). My goal is a fully working version of FF3, IE can wait.
I was just stuck on a weird error. When I drag the div for the first time, it works fine. When I drag it a second time, it doesn't stick after the button is released and I have to click again to get it. The third and subsequent drag and drop works flawlessly again (!?!).
Please see [source page] [1] (as I said, FireFox just for now) for an idea of what's going on. It's all done as a div with two events (onmousedown and onmouseup), using document.captureEvents (Event.MOUSEMOVE) to move in between. The script can be found here [here] [2] (ignore the bottom of the ajax, it is prepared for some extra tricks and the error remains if I take it out).
Please let me know if you have encountered something like this in the past or if you see an error somewhere. I know there might be better ways to get around all of this, but I'm specifically looking for a way to make my approach work.
Thank you for your time,
Mike
EDIT: Chrome and Safari work.
EDIT: Enable links offline, working with new version.
source to share
Ok, this works for me in FF3 first, if that's what you are asking for.
This is not what you want to hear, but I highly recommend you choose the DnD method from mootools or jquery or similar. In terms of efficiency, DnD is a terrible thing to be coded (did it a few times myself) and if you are unable (no offense outlined here) to resolve the numerous errors that occur, it will just be a huge drain of your time compared with just coming with a reliable mature implementation off the shelf. It's hard to do.
If you are doing something that needs to continue with your own code (as an exercise or out of pride - I can appreciate that :)), this issue is usually the result of the event not being captured where you think it is some other the event happened in the first place, the flag is not being set where you think it is, or (or because of) a bug that breaks out of your code at an unexpected point. Try to keep track of what is happening logically by choosing event triggers.
If you could figure out how it didn't work in more detail, I could track it down further (since I can't seem to replicate), but I suggest you explore the benefits of a solid library.
source to share