Question

我正在使用JQuery UI 1.10.3来构建可拖动元素列表。

当我将一个元素拖到另一个元素上时，我注意到拖动元素的白色区域是透明的，我能够看到下面的元素。

如何使其不透明？

这是jsfiddle：http://jsfiddle.net/mddc/UW5E2/4/

<ul>
  <li id="draggable">Drag me down</li>
</ul>

<ul id="sortable">
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  <li>Item 4</li>
  <li>Item 5</li>
</ul>

 $(function() {
    $( "#sortable" ).sortable({
      revert: true
    });
    $( "#draggable" ).draggable({
      connectToSortable: "#sortable",
      helper: "clone",
      revert: "invalid"
    });
    $( "ul, li" ).disableSelection();
  });

  ul { list-style-type: none; margin: 0; padding: 0; margin-bottom: 10px; }
  li { margin: 5px; padding: 15px; width: 150px; border: 1px solid #000}

谢谢！

Answer 1

只需为可拖动元素添加z-index值{CSS} position属性relative＆＃39; z-index: 9999; position: relative;＆＃39;。

{{1}}

希望它能奏效。

Answer 2

我通过简单地将一个CSS类附加到draggable来解决了我的问题，这个CSS类表明它的背景颜色是#fefefe（白色）。我遇到的问题是，draggale的空白区域是透明的。

我不觉得我做的是一个正确的解决方案，但它到目前为止工作。仍然喜欢看到更好的解决方案。

JQuery UI：draggable元素是透明的。怎么做不？

2 个答案: