diff --git a/Docs/Drag/Drag.md b/Docs/Drag/Drag.md index 3afe3765..46035bbb 100644 --- a/Docs/Drag/Drag.md +++ b/Docs/Drag/Drag.md @@ -26,6 +26,7 @@ Drag Method: constructor * handle - (*element*: defaults to the element passed in) The Element to act as the handle for the draggable element. * invert - (*boolean*: defaults to false) Whether or not to invert the values reported on start and drag. * limit - (*object*: defaults to false) An object with an x and a y property, both an array containing the minimum and maximum limit of movement of the Element. +* ratio - (*number*: defaults to false) Add a ratio constraint between x and y properties (ratio = x / y). * modifiers - (*object*: defaults to {'x': 'left', 'y': 'top'}) An object with x and y properties used to indicate the CSS modifiers (i.e. 'left'). * snap - (*number*: defaults to 6) The distance to drag before the Element starts to respond to the drag. * style - (*boolean*: defaults to true) Whether or not to set the modifier as a style property of the element. diff --git a/Source/Drag/Drag.js b/Source/Drag/Drag.js index bbe73cb4..3ddc51fd 100644 --- a/Source/Drag/Drag.js +++ b/Source/Drag/Drag.js @@ -43,6 +43,7 @@ var Drag = new Class({ grid: false, style: true, limit: false, + ratio: false, handle: false, invert: false, preventDefault: false, @@ -182,7 +183,15 @@ var Drag = new Class({ this.value.now[z] = this.limit[z][0]; } } - + + if(options.ratio) { + if(this.value.now.x / this.value.now.y < options.ratio) { + this.value.now.y = this.value.now.x / options.ratio; + } else { + this.value.now.x = options.ratio * this.value.now.y; + } + } + if (options.grid[z]) this.value.now[z] -= ((this.value.now[z] - (this.limit[z][0]||0)) % options.grid[z]); if (options.style) this.element.setStyle(options.modifiers[z], this.value.now[z] + options.unit);