Css 变换平移剪切拖拽图像答案

【问题标题】：Css transform translate cut drag imageCss 变换平移剪切拖拽图像
【发布时间】：2014-08-28 16:27:59
【问题描述】：

我有一个目标元素，它有一个 transform translate 和 draggable 属性。

编辑：这是更大应用程序的一部分，我必须保留 transform:translate。

由于变换，拖动时，拖动图像被剪切，因为变换不应用于它。如何在应用转换转换时保留正确的拖动图像？

小提琴：http://jsfiddle.net/bikiew/4dLt74z2/

<div class="item" draggable="true"></div>
.item {
  position: absolute;
  width: 100px;
  height: 50px;
  border: solid 1px white;
  background-color: grey;
  top: 50%;
  left: 50%;
  transform: translate(-30px, 0px);
}

有纯 CSS 的解决方案吗？

谢谢

【问题讨论】：

标签： html transform draggable

【解决方案1】：

http://jsfiddle.net/4dLt74z2/30/

尝试使用

margin-left:-30px;

代替变换。效果和a一样

transform: translate(-30px, 0);

【讨论】：

抱歉，我无法删除转换，我的应用程序需要它。