JQuery 拖动到父级之外

Question

我正在使用JQuery的draggable()；使 li 元素可拖动。唯一的问题是当元素被拖到其父元素之外时，它不会显示。也就是说，它不会离开其父 div 的范围。示例如下:/image/jo6tC.png - 就好像其他所有内容的 z-index 具有更高的优先级(并且元素滑到所有内容下方)。

代码如下:

$('.photoList li').draggable({ 
        distance: 20,
        snap: theVoteBar,
        revert: true,
        containment: 'document'
    });

li 元素放置在 DIV 中，如下所示:

<div class="coda-slider preload" id="coda-slider-1">
    <div class="panel">
        <div class="panel-wrapper">
            <h2 class="title" style="display:none;">Page 1</h2>
            <ul class="photoList">
                <li>
                    <img class="ui-widget-content" src="photos/1.jpg" style="width:100px;height:100px;" />
                </li>
            </ul>
        </div>
    </div>

我确信问题是它不会离开其父容器，但我不知道该怎么做才能将其取出。

任何指导或帮助将不胜感激!

Answer 1

我登陆此页面时遇到了完全相同的问题，布伦丹的回答让我很接近。设置 appendTo 选项没有帮助，但我可以通过将 overflow:visible 添加到可拖动元素的父级来解决我的问题。原来我是从链上的某个地方草率地继承隐藏的。

旁注，看起来这是可行的，因为 jQuery UI 通过动态设置相对于父级的定位来移动可拖动元素 - 这对我来说是新的英特尔!