dragscroll是一款非常小巧的可通过拖动来进行滚动的js插件。该拖动滚动插件的min版本只有410个字节。通过该插件你可以将整个页面或某个div转换为可用鼠标拖动来滚动的元素。这对于某些场合的展示效果是非常有用的。

dragscroll的最小版本dragscroll_micro.js大小为410个字节，仅支持基本的拖放滚动功能。

dragscroll的完整版本dragscroll.js大小有741个字节，它比最小版本多了一些额外的功能：

  • 添加了一个UMD模块。
  • 可以在页面加载后才被调用，插件会自动查找带有dragscroll class的元素，并将这些元素进行转换。最小化版本不能再页面初始化之后再加载，必须写在页面的<head>中。
  • 可以动态的添加或删除带有dragscroll class的元素。如果你执行了这些操作，要使用dragscroll.reset()方法来更新元素。

使用方法

要使用该鼠标拖动滚动元素js插件，先要在页面中引入dragscroll_micro.js或dragscroll.js文件。

<script src="dragscroll.js"></script>

然后在你需要进行拖动滚动的元素上添加class dragscroll。

<div class="dragscroll">
    Big text goes here...
</div>

就这么简单，现在这个元素就可以进行鼠标拖动滚动了。你也可以在<body>元素上添加dragscroll，使整个页面都可以进行鼠标拖动滚动。