0

There are a number of ways for a user to scroll a browser window, but there's one I find particularly irksome and would like to suppress. This would be where you click with the mouse and then drag the mouse outside of the window and it scrolls in the direction the mouse has been dragged.

This behavior is particularly annoying because the page I'm working on does things on both mousedown and mousemove, so its fairly easy for the user to be in the middle of this operation and slip off the page and screw up what they were doing. I can't just overflow: hidden because I do want the user to be able to scroll, just not by this particular method.

I could imagine lots of apps where this is a problem; for instance, click and drag away from center to zoom on the current frame of content with existing scrollbars might even want to support the mouse leaving the window via capture-mode events, but this will cause it to scroll!

The only thing I can think to do is do { overflow: hidden } and then implement custom scrollbars, but custom scrollbars tend to suck. I've been searching around for awhile and trying different things, but haven't seen a solution to this. Pardon if it's a dupe and I just didn't find the original.

user3786275
  • 103
  • 1
  • 7

1 Answers1

0

I found a reasonable answer to your question here: Disabling middle click scrolling with javascript

It seems that it's possible on certain browsers, but you might want to just tell people not to do that. It's not a very common action anyways.

Community
  • 1
  • 1
Danman
  • 496
  • 3
  • 19
  • Thanks for the link, but I think it's a different thing. When I middle-click in Chrome on Windows I get a different icon and I'm put in a different mode and I middle-click again to get out of it. What I'm referring to isn't that -- it's just a plain old left mouse click and drag. If you shrink this window down so there are scrollbars in the body section and just click and drag out of the window you should see what I mean: http://jsfiddle.net/p6pfdcm4/. – user3786275 Sep 24 '14 at 21:15
  • If, as in my example, I want to actually make use of mousedown + drag out of the window then I certainly can't just tell the user to avoid the action. =/ – user3786275 Sep 24 '14 at 21:17
  • Perhaps using body { position:fixed } is what you're looking for? – Danman Sep 24 '14 at 21:47
  • Gave that a try, but it removes the scrollbars entirely, so that works only about as well as { overflow: hidden }. The trouble is that I still want to allow scrolling by mousewheel, interacting with the scrollbar, keyboard shortcuts, etc. It's just this one gesture that's the culprit. Looking like I'll have to resort to implementing scrollbars manually. Still, thanks for the efforts! – user3786275 Sep 25 '14 at 14:00