jquery droppable iframe offset

Question

我试图使用knockout将html绑定到iframe.

主页面包含一个draggable,iframe包含一个droppable.我遇到的问题是该物品在错误的地方掉落,例如:

绿色是我希望下降发生的地方,但是红色是实际发生下降的地方 - 它似乎在正确的坐标处但没有考虑主页面上的iframes位置.

我已经尝试将iframefix应用于draggable和droppable但是它没有帮助:

iframe.find('.sim-row').droppable({
      iframeFix: true,
      drop: function (event, ui) {
           console.log("dropped");
      }
});

$('#drag').draggable({
     iframeFix: true,
     helper: "clone"
});

它想知道是否有某种方法根据iframes位置创建一个'偏移'并将其传递给draggable以便它可以计算出它的位置？

一些小提琴:主页 - http://jsfiddle.net/D26CQ/1/

iFrame - http://jsfiddle.net/cMfMq/

Answer 1

我能找到的最简单的解决方案是修改jqueryUI可拖动函数以考虑偏移量:

在$ .ui.ddmanager函数中添加以下行:

        m[i].offset.top -= m[i].element.parents().find("html,body").scrollTop();
        m[i].offset.left -= m[i].element.parents().find("html,body").scrollLeft();

        // iframe positioning 
        if (this.current.options.iframeOffset) {
            m[i].offset.top += this.current.options.iframeOffset.top;
            m[i].offset.left += this.current.options.iframeOffset.left;
        }

就在之前:

        m[i].proportions = { width: m[i].element[0].offsetWidth, height: m[i].element[0].offsetHeight };