Knob drags beyond right boundary [More 1.5.1]

Vote count:

0

When creating a nice slider using Mootools More 1.5.1 Slider class, I noticed that the 'knob' can be dragged too far to the right.

Consider this slider scenario:

|--|~|----------------|

I find I am able to do this:

|---------------------||~|

which is no good when the parent div has overflow:hidden set.

This occurs because the Drag object in the Slider class sets the left most x position ( limit.x[1] ) as the width of the passed in element (parent of the knob).

I would expect this limit to be the the element width minus the knob width.

I get the same problem whether the 'knob' is inside or outside the 'element' (above and below in the DOM).

The only way I could fix this was with a hack:

if(mySlider.drag.options.limit.x[1]===mySlider.element.getSize().x){
    mySlider.drag.options.limit.x[1] -= mySlider.knob.getSize().x;
    mySlider.drag.setOptions(mySlider.drag.options);
}

Check out this Fiddle (examples of broken and hacked).

Am I missing something here? Or should this be raised as a bug?

asked 27 secs ago

Eclectic

199

Knob drags beyond right boundary [More 1.5.1]