Vue.js拖动到滚动组件– vue-dragscroll

Vue.js拖动到滚动组件– vue-dragscroll
插件名称 vue-dragscroll
版本号 v3.0.0
发布时间 2020年12月15日
插件作者 donmbelembe

vue-dragscroll是一个微型vue.js指令,可通过按住鼠标按钮(“拖放”或“单击并按住”样式)进行滚动。

安装和下载:

$ npm install vue-dragscroll

用法

v-dragscroll指令添加到可滚动元素:

<div v-dragscroll>
    Big text goes here...
</div>

现在,您可以通过拖动来滚动它。

请记住,现在无法用鼠标选择内容,因此请应用cursor: default;CSS样式以防止混淆用户(甚至cursor: grab;在内容不是文本的情况下)。

/* EXEMPLE */
.grab-bing {
  cursor : -webkit-grab;
  cursor : -moz-grab;
  cursor : -o-grab;
  cursor : grab;
}


.grab-bing:active {
  cursor : -webkit-grabbing;
  cursor : -moz-grabbing;
  cursor : -o-grabbing;
  cursor : grabbing;
}

变更日志:

v3.0.0(03/30/2021)

  • 添加vue 3支持

v2.1.3(01/27/2021)

  • 更新

v2.1.0(12/12/2020)

  • 添加了scoll容器选项