Question

I am trying to create a Javascript/Jquery based application that will eventually go into my blog. Here is the jsFiddle

I am using chrome and have not tested on other browsers, but what it does so far on my browser is allow for the white “moveable” divs to become “snappable” within the left and right columns. I have seemed to gotten that part figured out. There are 2 other things I would like that I cannot figure out how to do.

1) I would like to make it so if there are 2 or more “moveable” divs in the same column and you try to move them over each other, they do not overlap. Right now they overlap, but I want the other div(s) to just move as well when they come into contact with each other. I tried using css to just change the positioning to relative but the rest of the code then breaks.

2) When you hold down the mouse on the div and move, sometimes it tries to highlight the div with the mouse, which kind of “glitches” out the div, forcing you to re-click. Is there a way around this?

Thanks

Answer 1

found a jQuery solution that uses collision detection