views:

315

answers:

1

I currently use the below code to be able to drag an element around inside a div container (this is important, it can't just be dragged around anywhere eon the page). I use mootools to accomplish this, but I am converting everything to use prototype, but I can't figure out how to get this to work with prototype.

    window.addEvent('domready', function(){
        var container = $('containment');
        new Drag.Move('dragger1', {'container': container});
    });

Update: I have found that I can use script.aculo.us to do the dragging, but I don't see anyway to confine movement within a defined space or div element.

A: 

I don't know that you can limit the dragable area with Prototype/Scriptaculous.

You can restrict the drop target so it can only be dropped in a specific place, but I'm not aware of a way to force it to stay within a certain boundary.

You might could write up something if you can determine the position of the containment element, but that might be more trouble than you are looking for. :)

Jason
Is there a way to do it some other way with Prototype?
James Simpson
I found this while digging around: http://www.talkincode.com/scriptaculous-confine-draggable-18.html Its a little bit more manual than jQuery, but it sounds like it would work and goes along with what I said above about determining the dimensions of the parent element.
Jason
Thank you! That is what I was looking for, with some slight modification to make it drag smoothly:else return n-(n%10); should be changed to else return n-(n%1); so that it moves by 1 pixel rather than chunks of 10.
James Simpson
Cool, glad it helped!
Jason