Hi, I'm trying to extend jQuery draggable to allow for multiple elements to be dragged at the same time.
I'm having reasonable success but would like some help with containment. As one element is being dragged, all grouped draggable elements will follow simultaneously. To see an example of how this will work go here: http://comp345.awardspace.com/multi/multi.html and control click to group elements. (This is an older demo and not indicative of how it is currently being coded.) The issue I am trying to solve is when a element is being dragged and I want to constrain all of the elements inside the containing element. So if any of the elements were to approach the edge I would want the dragging to stop there. I am looking in this section of code inside ui.draggable.js: if(this.originalPosition) { //If we are not dragging yet, we won't check for options if(this.containment) { I have a function groupedDimensions which retrieves the edge of the left-most and top-most elements in the group. I am trying to solve this for the left edge to start with, here is a look at the code: if (parseInt(groupedDimensions.left) || parseInt (groupedDimensions.left) === 0) { var eventLeft = pageX - this.offset.click.left; var eventLeftSpan = eventLeft - parseInt (groupedDimensions.left); // Distance from the event to the location of the left-most element var contBorderLeft = this.containment[0]; var eventBorderSpan = eventLeft - contBorderLeft; // Distance from the event to the location of the containment edge if (eventBorderSpan < eventLeftSpan) { // The distance from the event to the container is less than the event to the left-most edge so there must be a collision with container // Need to set pageX here!!!! } } // This code below included to give you an indication of where the above code sits inside file. if(event.pageY - this.offset.click.top < this.containment[1]) pageY = this.containment[1] + this.offset.click.top; if(event.pageX - this.offset.click.left > this.containment[2]) pageX = this.containment[2] + this.offset.click.left; if(event.pageY - this.offset.click.top > this.containment[3]) pageY = this.containment[3] + this.offset.click.top; I need help with the section marked // Need to set pageX here!!!!. I have tried several combinations and also drawn this out to try and figure out the maths but just can't get it. Hoping someone can help. The full code is too large for me to post here, but if there is anyone interested in helping I can provide a full example. Thanks for your help. --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "jQuery UI" group. To post to this group, send email to jquery-ui@googlegroups.com To unsubscribe from this group, send email to jquery-ui+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/jquery-ui?hl=en -~----------~----~----~----~------~----~------~--~---
