1

私はjQueryにかなり慣れていませんが、とても気に入っています。開発者に感謝します！:)

私の質問は、サイズ変更可能な関数についてです。状況は次のとおりです。

私にはdiv（parent-div）があり、その中に5つの他のdivがあります（互いに直接隣接しているので、それらをdiv-aからdiv-eと呼びましょう）。parent-divはタイムスパンを表し（長いほど、より多くの時間を表します）、5つのchildrendivはそのタイムスパン内の5つのステージを表します。

ここで、child-div-cのサイズを変更できるようにしたいと思います（たとえば、それが表すfaseにはもっと時間がかかります）。divのDとEは、Cのサイズを変更している間、左にシフトする必要があります。これは、それらのフェイズが、短くも長くもならず、後で発生しているためです。Cのサイズを変更するときは、合計期間が長くなるため、parent-divのサイズも変更する必要があります。

これが明確であることを願っています。質問は次のとおりです。

サイズ変更されたdivの横にdivを移動するにはどうすればよいですか？親divのサイズを変更するにはどうすればよいですか？

$（ "。selector）.resizable（{}）イベントを認識していて、それが機能するようになりました。しかし、2つのdivが隣り合っていて、そのうちの1つをサイズ変更している場合、それはうまくいきません。

前もって感謝します！

編集：この質問は反対票を投じられましたが、私は答えを見つけてJSfiddleを作成しました。受け入れられた答えについての私のコメントを参照してください。

私の2番目の質問に対する答えはこれでした：

$(".selector").resizable( {
       resize: function(event, ui) {
            var widthTotal = 0;
            $(".travelcontainer > .travelfase").each(function(index, element) {
                widthTotal = $(this).innerWidth() + widthTotal;
            });
});

これが他の誰かにも役立つことを願っています:)

4

2 に答える 2

3

子のdivがを使用して表示されている場合、float:leftまたはdisplay:inline-block前の子のサイズを変更した後、子を移動するために何もする必要がない場合。

親divの幅が固定されている場合は、子の合計を計算し、それを手動で設定（またはアニメーション化）する必要があります。

于 2012-07-28T21:54:26.433 に答える
2

http://jsfiddle.net/MjSfy/1/それはかなり簡単です。child-divをfloat:leftまたはに揃えるだけdisplay:inline-blockです。次に、1つの子divの幅を変更するたびに、親も調整されます。

アップデート：

次のようなものを使用して、実行時にdivの幅を設定します。

$("#div-a").css("width", "50px");​

更新されたフィドル： http： //jsfiddle.net/MjSfy/2/およびhttp://jsfiddle.net/MjSfy/3/

于 2012-07-28T22:15:59.767 に答える