Permalink
Browse files

Draggable: ignore overflow:hidden containers with scroll option

While it is true that overflow:hidden elements can be scrolled
programatically, this breaks user expectation. Therefore, do not
 scroll inside an overflow:hidden container.
  • Loading branch information...
mikesherov committed Aug 10, 2014
1 parent be4c0fc commit bbf9ea0942622a40d1adafeaed7045e0cf6ff8fd
Showing with 28 additions and 9 deletions.
  1. +14 −0 tests/unit/draggable/draggable_options.js
  2. +14 −9 ui/draggable.js
@@ -878,6 +878,20 @@ test( "scroll, scrollSensitivity, and scrollSpeed", function() {
TestHelpers.draggable.restoreScroll( document );
});
+test( "scroll ignores containers that are overflow: hidden", function() {
+ expect( 2 );
+
+ var element = $( "#draggable1" ).draggable({ scroll: true }).appendTo( "#scrollParent" );
+
+ element.simulate( "drag", {
+ dx: 1300,
+ dy: 1300
+ });
+
+ equal( $( "#scrollParent" ).scrollTop(), 0, "container doesn't scroll vertically" );
+ equal( $( "#scrollParent" ).scrollLeft(), 0, "container doesn't scroll horizontally" );
+});
+
test( "#6817: auto scroll goes double distance when dragging", function() {
expect( 2 );
View
@@ -827,30 +827,35 @@ $.ui.plugin.add("draggable", "opacity", {
$.ui.plugin.add("draggable", "scroll", {
start: function( event, ui, i ) {
- if ( i.scrollParent[ 0 ] !== i.document[ 0 ] && i.scrollParent[ 0 ].tagName !== "HTML" ) {
- i.overflowOffset = i.scrollParent.offset();
+ if ( !i.scrollParentNotHidden ) {
+ i.scrollParentNotHidden = i.helper.scrollParent( false );
+ }
+
+ if ( i.scrollParentNotHidden[ 0 ] !== i.document[ 0 ] && i.scrollParentNotHidden[ 0 ].tagName !== "HTML" ) {
+ i.overflowOffset = i.scrollParentNotHidden.offset();
}
},
drag: function( event, ui, i ) {
var o = i.options,
scrolled = false,
+ scrollParent = i.scrollParentNotHidden[ 0 ],
document = i.document[ 0 ];
- if ( i.scrollParent[ 0 ] !== document && i.scrollParent[ 0 ].tagName !== "HTML" ) {
+ if ( scrollParent !== document && scrollParent.tagName !== "HTML" ) {
if ( !o.axis || o.axis !== "x" ) {
- if ( ( i.overflowOffset.top + i.scrollParent[ 0 ].offsetHeight ) - event.pageY < o.scrollSensitivity ) {
- i.scrollParent[ 0 ].scrollTop = scrolled = i.scrollParent[ 0 ].scrollTop + o.scrollSpeed;
+ if ( ( i.overflowOffset.top + scrollParent.offsetHeight ) - event.pageY < o.scrollSensitivity ) {
+ scrollParent.scrollTop = scrolled = scrollParent.scrollTop + o.scrollSpeed;
} else if ( event.pageY - i.overflowOffset.top < o.scrollSensitivity ) {
- i.scrollParent[ 0 ].scrollTop = scrolled = i.scrollParent[ 0 ].scrollTop - o.scrollSpeed;
+ scrollParent.scrollTop = scrolled = scrollParent.scrollTop - o.scrollSpeed;
}
}
if ( !o.axis || o.axis !== "y" ) {
- if ( ( i.overflowOffset.left + i.scrollParent[ 0 ].offsetWidth ) - event.pageX < o.scrollSensitivity ) {
- i.scrollParent[ 0 ].scrollLeft = scrolled = i.scrollParent[ 0 ].scrollLeft + o.scrollSpeed;
+ if ( ( i.overflowOffset.left + scrollParent.offsetWidth ) - event.pageX < o.scrollSensitivity ) {
+ scrollParent.scrollLeft = scrolled = scrollParent.scrollLeft + o.scrollSpeed;
} else if ( event.pageX - i.overflowOffset.left < o.scrollSensitivity ) {
- i.scrollParent[ 0 ].scrollLeft = scrolled = i.scrollParent[ 0 ].scrollLeft - o.scrollSpeed;
+ scrollParent.scrollLeft = scrolled = scrollParent.scrollLeft - o.scrollSpeed;
}
}

0 comments on commit bbf9ea0

Please sign in to comment.