2

jquery FullCalendarプラグインを使用しており、カレンダーに外部イベントを追加しています。

この例からすべてが完全に機能します。ただし、カレンダーにドラッグする必要のある外部イベントがたくさんあるため、イベントのリストをスクロールする必要があります。

追加した：

overflow-y: auto;

親divに移動します。これにより、スクロールが可能になります。ただし、イベントが親divの外にドラッグされると、イベントは表示されなくなります。

これが何が起こるかのJSfiddleです

z-indexとoverflowの組み合わせをできるだけ多く試しましたが、親を離れると消え続けます。

親divをスクロールさせて、ドラッグしたときにイベントアイテムが消えないようにするにはどうすればよいですか？

4

1 に答える 1

4

これがDraggableの初期化である場合：

$(this).draggable({
    zIndex: 999,
    revert: true, // will cause the event to go back to its
    revertDuration: 0, //  original position after the drag
    scroll: false,
    //INSERT HERE
});

次に、次のいずれかのオプションを//INSERT HERE行に挿入します。

オプション1

    helper: 'clone',
    appendTo: 'body'

これは希望どおりに機能しますが、ドラッグされた要素はドラッグ時に複製されます。

これを回避するには、次のオプションを使用します。

オプション2

    helper: function(event, ui) {
        var clone = $(this).clone();
        $(this).css({opacity:0}); //or $(this).hide()
        return clone;
    },
    stop: function(event, ui) {
        $(this).css({opacity:1}); //or $(this).show()
    },
    appendTo: 'body'

例については、このフィドルを参照してください。

要素を実際に「移動」する必要がある場合（つまり、要素をドロップしても再表示されない場合）、remove()適切な場所にドロップされたら、要素に移動する必要があります。Droppablereceiveのコールバックに、元の要素を削除するものを追加できます。

于 2013-03-15T04:25:34.167 に答える