Trello 拖放效果

Posted 2023-03-03

【中文标题】Trello 拖放效果

【英文标题】：Trello drag and drop effect

【发布时间】：2012-07-03 06:49:16

【问题描述】：

有谁知道 Trello 是如何制作这些漂亮的拖放效果的，其中选定的卡片与文本可见略微倾斜？

我喜欢认为我查看了网络上的任何网站并大致了解所有内容是如何完成的，但我从未见过像这样无缝完成的效果。它是在服务器上动态设置样式并在拖动开始时加载的预渲染图像吗？

我知道的非常琐碎的问题！

【参考方案1】：

Trello 只是在 ui-sortable-helper 上使用 CSS rotate transformation

.list-card.ui-sortable-helper 
   transform: rotate(3deg);
   -moz-transform: rotate(3deg);
   -webkit-transform: rotate(3deg);

【讨论】：

谢谢 - 我刚开始看 CSS3，不知道它可以旋转。