Question

所以我一直在制作一个文件夹和文件系统，希望能够拖放到不同的文件夹/位置。

我让它在你可以拖动的地方工作，但我需要设置为隐藏的UI元素上的溢出，因为我不希望滚动条进入。

以下是我正在使用的内容：https://jsfiddle.net/4Lz5Lfsj/7/

HTML：

    <main>
  <div id="menu">
    <ul>
      <li class="folder">Text Here</li>
      <li class="folder">Text Here</li>
      <li class="folder">Text Here</li>
      <ul>
        <li class="clippet">Text Here</li>
        <li class="clippet">Text Here</li>
      </ul>

      <li class="clippet">Text Here</li>
      <li class="clippet">Text Here</li>
    </ul>
  </div>
</main>

CSS：

main
{
  display: inline-block;
  border: 1px solid black;
  padding-right: 12px;
}

#menu ul
{
  overflow: hidden;
}

JS：

$(".clippet").draggable({
    revert: "invalid",
    scroll: true,
    delay: 300,
    cursorAt: { left: -5 }
  });

  $(".folder").droppable({
    accept: ".clippet"
  });

正如您所看到的，拖动一个li元素时，在拖动它们时，它不允许在其父元素之外？

Answer 1

通过将隐藏的溢出添加到主菜单而不是菜单中来修复它。

拒绝菜单溢出overflow: none;

jQuery draggable不能使用overflow和UI元素

1 个答案: