Enables dragscroll on your website. It automatically detects when you want to select text, rather than scroll.
Please find a DEMO, here, together with more information on Utterscroll.
You could ask questions or make suggestions by clicking Leave a comment at the bottom of that page (i.e. the demo page). (Or via GitHub.)
Requires jQuery, tested with jQuery 1.7.2.
Use like so: (for example)
<script src='jquery-scrollable.js'></script>
<script src='debiki-utterscroll.js'></script>
if (!Modernizr.touch) // if not a smartphone
debiki.Utterscroll.enable({
scrollstoppers: '.CodeMirror, .ui-resizable-handle' });
Utterscroll is disabled inside the scrollstoppers
. (It automatically
understands to disable itself when you click buttons or select text,
so you probably don't need to configure many special scrollstoppers.)
Please find in utterscroll-example.html
a complete example HTML file, live here:
http://rawgit.luolix.top/debiki/utterscroll/master/utterscroll-example.html.
Please have a look in that file — there are some things to think about:
you currently need to load Utterscroll at the bottom of the HTML page,
and you cannot use Utterscroll before the jQuery onload event has happened.
Utterscroll works in nested scrollbars, however, if the wrapping element
doesn't have position: relative
or absolute
, the nested scrollbars
seems to be broken in Firefox. Have a look at the demo (link above, to
utterscroll-example.html) — in the demo, I've set position: relative
on the wrapping element, so it should work in Firefox.
Utterscroll scrolls the closest scrollable element, or the window.
However, scrolling anything but the window, depends on a jQuery
selector, ':scrollable', being available. Otherwise, the window is
always scrolled. So you should also include the file
jquery.scrollable.js
on your web page (it defines the ':scrollable'
selector). That file is an excerpt from
jquery-scrollintoview
by Robert Koritnik.
As of 2012-05-23, tested with jQuery 1.7.2 and recent versions of Chrome, FF, IE and Opera.
As of 2012-02-29, tested with jQuery 1.6.4 and recent versions of Google Chrome, Firefox and Opera, and IE 6, 7, 8 and 9. (Scrolling the window has been tested; scrolling other elems has not been very thoroughly tested.)
Copyright (c) 2012 Kaj Magnus Lindberg
Licensed under the GNU Lesser General Public License version 2.1, or (at your option) any later version. See the top of debiki-utterscroll.js and lgpl-2.1.txt and lgpl-3.0.txt and http://www.gnu.org/licenses/.