jQueryUI 可排序和可拖动的目标不会水平滚动以进行拖放,但会进行排序



我有两个包含多个div的DIV,并且可以滚动。我有一个垂直div,该div在包含的divs上具有可拖动。我的水平div是可以分类的,我通过ConnectTosortable将拖动连接到它。

当重新安排项目时,水平排序可以水平滚动。但是,如果我从垂直方向拖动到水平方向,它不会像我做纯粹的排序时那样滚动水平div。

我已经在这里阅读了所有条目,用于滚动使用Scrollto和衍生产品等插件,它们无济于事。我正在使用jQuery 1.8.3和jQuery UI 1.9.2

我可以进入视口,但我希望我的用户能够像排序时一样拖动并进行水平滚动工作。如果我掉入可见区域,然后排序它将滚动div。

谢谢!

$(".playboxresults, .playboxrecommended").draggable({
        revert: "invalid",
        opacity: 0.95,
        containment: 'document',
        connectToSortable: "#divCurrentList",
        helper: function () {
            $copy = $(this).clone();
            return $copy;
        },
        appendTo: 'body',
        scroll: true,
        start: function (e, ui) {
            draggedItem = ui.item;
        }
    });

这是因为当您使用附加物时,助手成为身体的一部分,因此不会滚动水平div。

我也在实施此功能,并因此找到了解决方法。

helper: function(){
     $('#horizontalDiv').append('<div id="clone">' + $(this).html() + '</div>');
     $("#clone").hide();
     setTimeout(function(){
         $('#clone').appendTo('body');
         $("#clone").show();
     },1);
     return $("#clone");
},

这使您的水平div的助手部分首先将其附加到身体上。

希望这会有所帮助。

您也可以参考此

最新更新