draggabilly()使用方法

<div class="one"></div>

<div class="two"></div>

<div class="three">
<div class="threediv">容器里面移动</div>
</div>
<div class="four">网格移动</div>
<div class="five">
<div class="fivediv">把手</div>
</div>

<script src="jquery-1.12.2.min.js"></script>
<script src="draggabilly.pkgd.min.js"></script>
<script>
$("div").css({"background-color":"skyblue","width":"200px","height":"200px"});
$(".one").draggabilly();//可自由移动

$(".two").draggabilly({axis:"X"});//只能X轴移动

$(".threediv").draggabilly({containment:true}); //只能容器内移动
$(".four").draggabilly({grid:[200,200]}); //只能网格移动
$(".five").draggabilly({handle:".fivediv"});//只能拎住把手移动

</script>

转载于:https://www.cnblogs.com/zhangxiaohui-48/p/6626262.html