Question

我正在构建一个小而简单的时间轴调度程序，可以拖入外部事件（div）。在时间轴中，有一天存在8小时。

当我将draggin选项snap设置为snap元素（.drop tr）并将snapMode设置为inner时。在droppable的over方法中，当拖动的元素位于drop元素上时，bg颜色正在被更改。

但我有一些问题

当我将元素向下拖动到droppable（over）上时，事件bg被更改，但是当向上拖动元素时仍然会调用out方法，这怎么可能？
当横向拖动事件时，我需要15分钟的间隔。所以我在考虑宽度单元格（20px）= 1小时/ 4 = 5px（15分钟）。我用可拖动的网格尝试了这个，但它无法正常工作。

对于代码，我添加了一个jsfiddle，不要看它的概念风格:)。

Jquery部分

$(function()
{
    $('.evt').draggable({
        revert  : 'invalid',
        grid    : [20 / 4, 40],
        snap    : '.drop tr',
        snapMode: "inner"
    });

    $('.day tr').droppable({
        accept   : '.evt',
        tolerance: "fit",
        over     : function(event, ui)
        {
            $(ui.draggable).css('background', 'lightgreen');
            console.log('over');
        },
        out      : function(event, ui)
        {
            $(ui.draggable).css('background', 'red');
            console.log('out');
        }
    });
});

https://jsfiddle.net/dvr4zysc/

我希望有人可以帮助我

jQuery拖放时间线容差

0 个答案: