相关疑难解决方法(0)

jQuery ui draggable elements在滚动div之外不是'draggable'

我在div中有很多元素(浮动href标签),设置高度/宽度,overflow: auto在CSS中设置滚动.

这是div的结构:

<div id="tagFun_div_main">
<div id="tf_div_tagsReturn">
    <!-- all the draggable elements go in here, the parent div scolls -->
</div>
<div id=" tf_div_tagsDrop">
    <div id="tf_dropBox"></div>
</div></div>
Run Code Online (Sandbox Code Playgroud)

父div,'tf_div_tagsReturn'和'tf_div_tagsDrop'最终会相互浮动.

这是在使用类名'tag_cell'创建所有'draggable'元素之后运行的jQuery,:

$(function() {
    $(".tag_cell").draggable({ 
        revert: 'invalid', 
        scroll: false,
        containment: '#tagFun_div_main'
    });
    $("#tf_dropBox").droppable({
        accept: '.tag_cell',
        hoverClass: 'tf_dropBox_hover',
        activeClass: 'tf_dropBox_active',
        drop: function(event, ui) {
            GLOBAL_ary_tf_tags.push(ui.draggable.html());
            tagFun_reload();
        }
    });
}); 
Run Code Online (Sandbox Code Playgroud)

如上所述,可拖动元素在div'tf_div_tagsReturn'中可拖动,但它们不会在视觉上拖动到父div之外.值得注意的是,如果我拖动其中一个可拖动的元素,并将鼠标移动到droppable div上,并且id为'tf_dropBox',那么hoverclass会被触发,我再也看不到可拖动的元素了.

这是我第一次使用jQuery,所以希望我只是缺少一些非常明显的东西.我一直在阅读文档和搜索论坛到目前为止没有占上风:(

更新:

非常感谢Jabes88提供的解决方案,使我能够实现我想要的功能.这是我的jQuery最终看起来像:

$(function() {
    $(".tag_cell").draggable({ 
        revert: 'invalid', 
        scroll: false,
        containment: '#tagFun_div_main',
        helper: 'clone',
        start : function() {
        this.style.display="none";
        },
        stop: …
Run Code Online (Sandbox Code Playgroud)

jquery user-interface scroll drag-and-drop

35
推荐指数
2
解决办法
4万
查看次数

jQuery Ui:无法从Div中拖出元素溢出

我在div中有一个简单的UL,溢出设置为自动和固定高度.每个LI都可以通过jQuery拖动.问题是我无法将它们从div拖动(它们在拖动到边界时会消失).

我看过这个问题及其答案,但这里的解决方案对我来说似乎不起作用(设置滚动选项): jQuery Draggable和overflow问题

谢谢

jquery jquery-ui

6
推荐指数
2
解决办法
3288
查看次数