在画布网格中拖放图像答案

【问题标题】：Drag & Drop Images in Canvas Grid在画布网格中拖放图像
【发布时间】：2014-10-06 10:27:45
【问题描述】：

我正在将一个矩形容器和图像从菜单拖放到画布网格上，然后移动它们。目前我可以将它们多次加载到画布上并在双击时删除它们，如图所示链接如下。

我面临的问题是，当我尝试将容器和图像拖放到画布网格中时，它们会被拖放到所需位置的右侧。如果我尝试将它们拖放到网格的左侧，然后它们会落在网格的中心，当我试图将它们放在网格的中心时，它们会落在网格的右侧。使它们可拖放的功能是

var $clone = ui.helper.clone();
// all clones are draggable
// if clone is shape then draggable + resizable
if (!$clone.is('.inside-droppable')) {
    $(this).append($clone.addClass('inside-droppable').draggable({
            containment: $stageContainer,
            tolerance: 'fit',
            cursor: 'pointer',
            position: 'relative'             
            }));

    if ($clone.is(".imag") === false) {
            $clone.resizable({
                containment: $stageContainer
            });          
    }
    $clone.on('dblclick', function () {
        $clone.remove();
        layer.draw();
    });
   }

我似乎无法理解我在上述函数中哪里出错了，将容器和图像拖放到画布网格的所需位置..请帮助

【问题讨论】：

标签： javascript jquery drag-and-drop kineticjs

【解决方案1】：

我没有深入阅读你的代码，但是通过在拖放功能中添加以下行，它可以正常工作

 $clone.css({top: y, left: x, position:'absolute'});

SEE DEMO HERE

【讨论】：