javascript - 拖放不适用于溢出自动

Question

你好， friend 们，我正在尝试在我的页面上添加拖放功能，但我遇到了一些问题。你可以下载我的文件here问题是当你打开 index2.html 它与 css 完美配合

#leftColumn{
        width:300px;
        float:left;     
    }

但是当我在 index.html 的 id leftColumn 上添加一些 css 时

#leftColumn{
        width:300px;
        float:left;
        height:100px;
        overflow:auto;

    }

正如您在文件中看到的那样，它停止正常工作，在 index,html 中左侧的可拖动框不随鼠标移动请帮助。

谢谢

Answer 1

您需要从您正在抓取的子级父项中减去“.scrollTop”


编辑:

在 js/drag-drop-custom.js

第533行我改了
this.dragObjCloneArray[this.numericIdToBeDragged].style.top = dhtmlSuiteCommonObj.getTopPos(this.dragDropSourcesArray[this.numericIdToBeDragged][0]) + 'px';
-到-
this.dragObjCloneArray[this.numericIdToBeDragged].style.top = dhtmlSuiteCommonObj.getTopPos(this.dragDropSourcesArray[this.numericIdToBeDragged][0]) - this.dragObjCloneArray[this.numericIdToBeDragged].parentNode.scrollTop + '像素';

第597行我改变了
dragObj.style.top = topPos + 'px';
-到-
dragObj.style.top = topPos - dragObj.parentNode.scrollTop + 'px';

第670行我改了
var targetY = dhtmlSuiteCommonObj.getTopPos(referenceToDragDropObject.dragDropSourcesArray[numId][0]);
-到-
var targetY = dhtmlSuiteCommonObj.getTopPos(referenceToDragDropObject.dragDropSourcesArray[numId][0]) - this.dragObjCloneArray[numId].parentNode.scrollTop;

现在它在您的示例中工作正常，但这仅用于垂直问题，如果您打算让它水平滚动，那么您将拥有对 scrollLeft 做同样的事情。如果您在这方面需要帮助，那么我很遗憾地告诉您这对您来说太高级了。