兼容移动手机的js拖拽插件Draggin.js

当前位置:主页 > jQuery库 > 工具类 > 兼容移动手机的js拖拽插件Draggin.js
兼容移动手机的js拖拽插件Draggin.js
分享:

    插件介绍

    Draggin.js是一款兼容移动手机的js拖拽插件。该js拖拽插件的特点是跨平台,体积小,运行速度快。该js拖拽插件会自动计算元素相对于文档左上角的位置,然后通过CSS transform属性将它重新定位。

    浏览器兼容性

    浏览器兼容性
    时间:2018-02-05
    阅读:
小编推荐: 掘金是国内最活跃的技术社区,从 jQuery到vue,从前端教程到开源库,无论是入门还是进阶,来掘金你不会错过前端开发的任何一个技术干货。
简要教程

Draggin.js是一款兼容移动手机的js拖拽插件。该js拖拽插件的特点是跨平台,体积小,运行速度快。该js拖拽插件会自动计算元素相对于文档左上角的位置,然后通过CSS transform属性将它重新定位。

Draggin.js拖拽插件插件的特点还有:

  • 轻量级,压缩后的版本仅3k。
  • 完全兼容移动触摸设备。
  • 使用时不需要编写任何js代码。
  • 插件利用GPU提高性能。
  • 没有任何外部依赖文件。

使用方法

在页面中引入draggin.min.js文件。

<script src="draggin.min.js"></script>
                
HTML结构

使用该js拖拽插件,你可以拖拽任何HTML DOM元素,例如:

<h1 class="text">Hello, World!</h1>
<p class="text">Hello, World!</p>
<a href="#" class="text">Hello, World!</a>
<div class="text">Hello, World!</div>
                

Draggin.js js拖拽插件的github地址为:https://github.com/chrisnunes57/Draggin.js

网友评论