0

私は、すべてのセルが特定のクラスのドラッグ可能なものを受け入れるドロップ可能な単一の列テーブルを持っています。このテーブルの境界線は表示されていますが、固定サイズのセルに色を付けて表示したくないので、見苦しく見えます。ドラッグ可能なものをセルとの交点にドラッグすると、セルが強調表示されますが、これは難しくありませんが、この強調表示をドラッグ可能なサイズにすることも必要です。すべてのドラッグ可能なものは幅が固定されていますが、高さが他のものよりも大きいものもあるため、高さを調整するだけで十分ですが、どこから始めればよいかわかりません。これは、私が探している適応の例です。

4

1 に答える 1

1

要件として、ドラッグ可能/ドロップ可能の代わりに jQueryUI "Sortable" を使用することをお勧めします。jQueryUI サイトのポートレットのデモを参照してください 。これは、探している機能であるはずです。

編集：@Subhamoy、あなたの言いたいことがわかりました。これは、Sortable を使用し、CSS に依存してテーブルを作成するソリューションです: jsfiddle へのリンク

重要な部分は、プレースホルダーのサイズ変更を処理する「over」ハンドラーです。

$( ".target .tbody" ).sortable({
    forcePlaceholderSize: true,
    placeHolder: "ui-sortable-placeholder",
    connectWith: ".source .tbody",
    items: "> .tr",
    over: function(event, ui) {
        var $context = $(this)
            ,$h = ui.helper
            ,$p = $('.ui-sortable-placeholder', $context)
            ,hheight = $h.height()
        ;
        $p.removeAttr("style");
        $p.css("height", hheight + "px");
    }
});
于 2013-02-15T15:46:48.450 に答える