我正在尝试实现一个可以拖动'drap元素的网格。我找到了dragula,完全符合我的需求!唯一的问题是,我需要让瓷砖在它们移开时放置动画,让它们被拖动。 (希望很清楚。:))
我尝试添加transition: all 1s ease-out
,但所有这些都是不透明的动画。
如何设置位置变化的动画?
dragula([document.getElementById('left-rm-spill')]);
.container {
background-color: lightgreen;
display: flex;
align-items: center;
flex-wrap: wrap;
}
.container * {
background-color: orange;
border: 1px solid;
height: 50px;
width: 100px;
transition: all 1s ease-out;
}
<script src="https://cdn.rawgit.com/bevacqua/dragula/master/dist/dragula.js"></script>
<link href="https://cdn.rawgit.com/bevacqua/dragula/master/dist/dragula.css" rel="stylesheet" />
<div id="left-rm-spill" class="container">
<div>Anxious Cab Driver</div>
<div>Thriving Venture</div>
<div>Such <a href="http://ponyfoo.com">a good blog</a>
</div>
<div>Calm Clam</div>
</div>