jquery.event.dragscroll
Version:
Dragscroll allows you to create numerous inertia scrolling areas all with their own properties.
149 lines (126 loc) • 2.56 kB
HTML
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<!-- see http://www.html5rocks.com/en/mobile/touch.html
prevents native zooming -->
<meta name="viewport" content="width=device-width user-scalable=no
initial-scale=1.0,maximum-scale=1.0"/>
<meta name="apple-mobile-web-app-capable" content="yes">
<!-- ie9+ rendering support for latest standards -->
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title>Dragscroll test page</title>
<script
src="https://code.jquery.com/jquery-3.1.1.slim.js"
integrity="sha256-5i/mQ300M779N2OVDrl16lbohwXNUdzL/R2aVUXyXWA="
crossorigin="anonymous">
</script>
<script src="node_modules/jquery.event.ue/jquery.event.ue.js"></script>
<script src="dist/jquery.event.dragscroll.js"></script>
<script>
$(function (){
var scroll_obj = $.makeDragScrollObj({
_$scroll_box_ : $( 'body' )
});
$( 'body' )
.on( 'udragend', scroll_obj._onendHandler_ )
.on( 'udragmove', scroll_obj._onmoveHandler_ )
.on( 'udragstart', scroll_obj._onstartHandler_ )
;
});
</script>
</head>
<body>
<p>
<pre>
$(function (){
var scroll_obj = $.makeDragScrollObj({ _$scroll_box_ : $( 'body' ) });
$( 'body' )
.on( 'udragend', scroll_obj._onendHandler_ )
.on( 'udragmove', scroll_obj._onmoveHandler_ )
.on( 'udragstart', scroll_obj._onstartHandler_ )
;
});
</pre>
<p>Content<p>
<p>That</p>
<p>Should...</p>
<p>Scroll.</p>
<p></p>
<p>Content<p>
<p>That</p>
<p>Should...</p>
<p>Scroll.</p>
<p></p>
<p>Content<p>
<p>That</p>
<p>Should...</p>
<p>Scroll.</p>
<p></p>
<p>Content<p>
<p>That</p>
<p>Should...</p>
<p>Scroll.</p>
<p></p>
<p>Content<p>
<p>That</p>
<p>Should...</p>
<p>Scroll.</p>
<p></p>
<p>Content<p>
<p>That</p>
<p>Should...</p>
<p>Scroll.</p>
<p></p>
<p>Content<p>
<p>That</p>
<p>Should...</p>
<p>Scroll.</p>
<p></p>
<p>Content<p>
<p>That</p>
<p>Should...</p>
<p>Scroll.</p>
<p></p>
<p>Content<p>
<p>That</p>
<p>Should...</p>
<p>Scroll.</p>
<p></p>
<p>Content<p>
<p>That</p>
<p>Should...</p>
<p>Scroll.</p>
<p></p>
<p>Content<p>
<p>That</p>
<p>Should...</p>
<p>Scroll.</p>
<p></p>
<p>Content<p>
<p>That</p>
<p>Should...</p>
<p>Scroll.</p>
<p></p>
<p>Content<p>
<p>That</p>
<p>Should...</p>
<p>Scroll.</p>
<p></p>
<p>Content<p>
<p>That</p>
<p>Should...</p>
<p>Scroll.</p>
<p></p>
<p>Content<p>
<p>That</p>
<p>Should...</p>
<p>Scroll.</p>
<p></p>
<p>Content<p>
<p>That</p>
<p>Should...</p>
<p>Scroll.</p>
<p></p>
</body>
</html>