实现页面中元素的拖拽功能 Draggabilly
·

代码以在jquery中使用为例,包管理工具、cdn引入等其他的形式的使用参考中文文档
<script type="text/javascript" src="/js/tools/draggabilly.min.js"></script>
<button class="flowBtn">
<image src="/images/flow.png"></image>
</button>
$('.flowBtn').draggabilly({containment:true})
备注:
$('.flowBtn').draggabilly()调用这个函数就可以完成拖拽了,但是没有限制范围,元素会被拖到屏外{containment:true}参数接收一个对象,containment为true时默认拖拽范围为父元素内{containment: '.container'}也可以是css选择器,拖拽范围为 css选择器选中的元素
如果拖拽失败,有可能是拖拽元素的层级不够,给z-index属性值设置大点!!
获取源码打包文件
官方文档:https://draggabilly.desandro.com/
更多推荐


所有评论(0)