Javascript 在指针上居中拖放代理

我正在使用ExtJS拖放并尝试将拖动代理置于光标下方的中心位置（代理：表示被拖动元素的半透明填充）。我可以像这样将其物理居中，但之后它不会正确下降：

view.dragZone = Ext.create('Ext.dd.DragZone', view.getEl(), {

    onStartDrag: function(x, y) {
        this.setDelta(150, 20); // (the element is 300 x 40)
    },

    //.. other DD configs

});

当我使用它并将光标移动到放置区域时，它会滑回原始位置，就像我将光标随机放置在某个地方一样

如果不使用此选项，光标距离对象西北方向约20像素（即不居中），但我可以将其完全放置在放置区域中

我认为这可能与光标不直接位于拖放区域上有关，因为它现在直接位于拖动代理上。我尝试重置拖放区域的z索引，尝试将其置于拖动代理之上，但这似乎不起作用。尝试了其他一些不值得一提的非常随意的事情

---

是否有人成功地设置了拖放，使拖动代理位于光标的中心？

我能够使代理居中，并在实时预览中看到它正确地拖放

---

Ext.view.DragZone

与

Ext.dd.DragZone

没有太大区别。但是，

Ext.view.DropZone

添加了相当多的逻辑来检查记录的删除位置。我猜逻辑可能就是为什么drop可以正确地用于grid drag/drop插件的原因。

在阅读了这个类之后，我认为您有一个观点。有没有关于如何为常规拖放实现它的想法？当您拖动时，DropZone的getTargetByEvent方法返回什么？我觉得它好像没有返回节点。当这种情况发生时，调用默认的onContainerOver逻辑，返回false以指示不允许拖放。Ext.view.DropZone的getTargetByEvent方法根据鼠标在页面上的实际位置添加额外的逻辑来抓取节点。我尝试使用

document.querySelectorAll（':hover'）

和

document.elementFromPoint

，但不幸的是，它们只返回代理元素。我想这意味着您必须实现自己版本的

getTargetByEvent

，手动获取元素，该元素具有当前鼠标XY位置所在的区域。我不知道把鼠标光标放在代理上是否值得费心（以及可能的效率问题）。谢谢你在这方面的帮助，你基本上是对的。除了IE，我还可以在其他方面发挥巨大的优势，但我现在有一个跨浏览器的解决方案，我将在稍后发布一个答案。

Ext.create('Ext.data.Store', {
    storeId:'simpsonsStore',
    fields:['name'],
    data: [["Lisa"], ["Bart"], ["Homer"], ["Marge"]],
    proxy: {
        type: 'memory',
        reader: 'array'
    }
});

var p = Ext.create('Ext.grid.Panel', {
    store: 'simpsonsStore',
    columns: [
        {header: 'Name',  dataIndex: 'name', flex: true}
    ],
    viewConfig: {
        plugins: {
            ptype: 'gridviewdragdrop',
            dragText: 'Drag and drop to reorganize'
        }
    },
    height: 200,
    width: 400,
    renderTo: Ext.getBody()
});

p.view.plugins[0].dragZone.onStartDrag = function() {
    this.setDelta(80, 10);
};