I am thinking of adding drag-scroll function for a mouse (aka iOS-like flicker) on a textarea by using some jQuery library, where I also want to allow selection of the text with mouse drag. As they are driven by the same kind of event (i.e., dragging), they will interfere. What is the best way to make it possible for them to coexist?

The idea that comes to mind are: using right-mouse-button-dragging for one of them and left for another, or pressing some key for one and not for the other, or switching between modes, etc.

2 Answers 2


This is very nonstandard on the web - either the left mouse button drag-scrolls or it drag-selects, depending on the type of element, and the right mouse button pops up a menu. Example: in google maps the left button scrolls the map element (div) and in all the other places on the page has the more conventional behavior of selecting text or dragging links. (This was very disconcerting at first because it was nonstandard, but google maps has become ubiquitous enough so that it is not longer unconventional.)

There are some ways to have both drag-select and drag-scroll in the same element: the right-button drag you suggest is probably the least unconventional, and it would be the approach I would use.

But it still is unconventional, and it does have the downside of displacing the popup menu, and that may disturb some users who happen to use the popup menu. There are various key-mouse-button combinations that could also be used: control-left-button, shift-right-button, etc. but many of these combinations already have an established behavior you'd be overriding.

In any case whatever you do to have both drag-select and drag-scroll in the same element will be unconventional, so you should do whatever you can to mitigate this, including explicit statements ("Right mouse button will drag"), pointer changes for feedback, etc.


I think you can do this easier for your users if you check the state of selected text first. If text is selected, then move that text according to mouse movement. If no text is selected, do the drag-scrolling instead.

  • How would it even be possible to select with mouse when nothing is selected?
    – sawa
    Commented Feb 24, 2013 at 7:04
  • @sawa Selecting text is done horizontally, scrolling would be done vertically, I'd hope?! Commented Feb 24, 2013 at 7:07
  • Although that may work when selection does not go beyond a single line, selection does go vertical when it expands for multiple lines. But there still may be some way along the line you are considering.
    – sawa
    Commented Feb 24, 2013 at 7:13
  • @sawa But when you have started selecting a word, that event may continue across multiple lines of text. Commented Feb 24, 2013 at 7:19
  • That is possible in principle, but it adds complexity to the user to prohibit to start selecting with vertical move.
    – sawa
    Commented Feb 24, 2013 at 7:24

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.