jquery - 具有包容性的可拖动和可调整大小的 div 超出包容性

我正忙于时间表脚本，为此我需要使用 jQuery 可拖动和可调整大小。
但是你可以在 te jsFiddle 中看到draggable有一个父级，但是你可以在每次点击时将它拖到父级上10px。
编辑:
我需要的是它不能被拖到容器外。
谁能帮忙

http://jsfiddle.net/QBX2B/1/

html:

        <div class="containment" style="display:block; height:40px; width:150px; background-color:#f2f2f2;">
        <div class="baldie" style="display:block; height:40px; width:150px; background-color: rgba(214, 255, 210, .7);"/>
    </div>

查询:

                $('.baldie').resizable({
                        containment: "parent",

                    }).draggable({
                        grid: [5,0],
                        containment:"parent",
                        drag: function( event, ui ) {

                        }
                    });

最佳答案

向容器添加 position:relative; 解决了这个问题。

我已经修改了您的代码检查运行，您可以检查它:-

<div class="containment" style="position: relative; display:block; height:40px; width:150px; background-color:#f2f2f2;">
            <div class="baldie" style="display:block; height:40px; width:150px; background-color: rgba(214, 255, 210, .7);"/>
        </div>

检查 :-

Jquery UI resizable issue expands beyond containment (draggable also used)

关于jquery - 具有包容性的可拖动和可调整大小的 div 超出包容性，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/16586844/