css - 垂直滚动和逃离容器的 child

Question

我想使用 jquery sortable 来重新排列元素列表。我希望我的列表可以(垂直)滚动，同时让可排序的句柄弹出到列表的右侧。

为了标记的原型(prototype)，我创建了一个列表，并定位了 handle ，使其向右弹出，但是一旦我打开垂直滚动，它就会在两个轴上滚动，我松开了我的弹出窗口(它是隐藏的)你需要滚动它来查看，而我真的只是想让它弹出列表之外)。

删除 overflow-y: scroll 意味着它可以正确呈现，但现在我无法垂直滚动。

我可以做些什么来完成这项工作吗？

(我也尝试过使用可排序 dom 结构之外的可排序句柄，但可排序似乎不喜欢可排序项中未包含的句柄。)

谢谢。

http://jsfiddle.net/Lqfxp1eh/1/

<style>
#container {
    width: 300px;
    height: 200px;
    border: 1px solid #0000ff;

    /* adding this stops the .pop boxes from escaping the container */
    overflow-y: scroll; 
}
#container li {
    border: 1px solid #00ff00;
    position: relative;
}
#container .pop {
    width: 220px;
    height: 40px;
    top: -10px;
    left: 130px;
    border: 2px solid #0000ff;
    position: absolute;
}

</style>
<div id="container">
    <div>
        <ul>
            <li>1</li>
            <li>2
                <div class="pop"></div>
            </li>
            <li>3</li>
            <li>4</li>
            <li>5</li>
            <li>6</li>
            <li>7</li>
            <li>8</li>
            <li>9</li>
            <li>10</li>
        </ul>

    </div>
</div>

Answer 1

http://jsfiddle.net/Lqfxp1eh/5/

将您的 .pop div 移出可滚动容器，并将其定位在新的父元素上

我不确定“可排序”部分，因为相关代码似乎丢失了？