Dragscroll – a tiny JS library which enables scrolling via mouse drag | Hacker News Reader

Dragscroll – a tiny JS library which enables scrolling via mouse drag

github.com

29 pointsxpostman20 comments

Even before having a mouse with wheel I used to scroll stuff with by dragging: I just selected text and when the selection reached the border, it started to scroll. I bet I'm not the only one. Anybody considering disabling selection or showing social media tools after selecting text should consider such weird behaviour.

Nowadays I use my Thinkpad without Synaptics or trackpoint drivers and the middle button works perfectly: Either using it open links in new tabs, or pressing it to start scroll mode. Now the mouse pointer changes and moving it scrolls. Unfortunately some software breaks this, probably WPF

Relevant xkcd: https://xkcd.com/1172/

Tangentially, what's a good JS library to implement drag/drop on mobile?

I'm thinking of one site in particular that implements prioritizing choices by drag/dropping them into order of preference. But when you try to use the site on a mobile browser, it just scrolls the page when you try to drag an item.

I'd like to suggest to them how to fix it, rather than just complain.

If they are using jquery UI, then there is a small fix addon called "touch punch" which repairs it.

A similar approach should work for other libraries. You need to handle the "touch" events in addition to "mousedown" and "mouseup".

Check out Hammer.JS: http://hammerjs.github.io/

It's a nice idea, but could it be made to be mobile friendly? For example when touch scrolling on a device the text scrolls in a choppy fashion rather than smooth with momentum.

I understand this is for desktop, but it would be nice if it could not get in the way of what div/overflow gives us for free.

Sorry, I think I don't clearly get what you mean. Tablets normally scroll smoothly pixel-wise as long as you move the finger. In fact, dragscroll implements the similar behaviour for desktops, because I consider such behaviour as more reasonable in many cases (comparing to selecting the content of the area, I mean).

You are right about how tablets are supposed to work.

The problem is that in your examples this behavior no longer functions as expected on tablets.

The example should work well for both desktop and tablet. Your current implementation changes the normal behavior on tablets.

There probaby an bug in dragscroll then. It is not supposed to break the behaviour on tablets, will test it..

The problem with solutions like these: without a notice, how will the user ever know that they can drag scroll on my site? Perhaps for a web app with a limited user base that can be educated...

The cursor changes. Admittedly, if people aren't capable of noticing that, they may be a lost cause.

True for images, but not for the text (chromium+linux). And I get annoyed when I cant select text.

This is defined by the developer actually. And besides there is no problem for a user if he does not know that he can scroll with dragging.

I also like the idea. Would be cool if it could work naturally with pointer lock - annoying to have to reset pointer position manually :)

then you will have to manually reset the mouse on the table :-D

sort of interesting. i expected it to have velocity/inertia, but I think that would make it much more than ~900 bytes

Why shouldn't this be up to the mouse driver? I used to just use middle-click for this.

Because sometimes there are scrollable areas on the page that you want to pan, not scroll, but there's no panning built into HTML. Yes, mouse drivers should make it possible to pan any scrollable area, but most don't, and websites have to be usable with shitty drivers.

I've been using ftscroller which is great for emulating UIScrollView

Nifty

Reply on news.ycombinator.com