8

phonegap (ビルド) を使用していますが、div コンテナー内に可変数の div を追加すると問題が発生します。これは、コンテナーがそれに応じて高さを増やすことを期待するためですが、そうではありません。

私は成功しなかったトリックを試しました。また、さまざまなオーバーフローと高さ:自動の組み合わせも試しましたが、成功しませんでした。

私は現在、コンテナーの高さを動的に増やすことに取り組んでいますが、正直なところ、よりエレガントな方法が必要だと確信しています (つまり、このコンテナーは他のコンテナー div 内にある可能性があり、想像できません)この動作が必要になるたびに、それぞれにこのコードを追加する必要があります)。

皆さんは、この (本当によくあることだと思いますが) この状況にどのように対処していますか?

編集：

ダニエルの答えに基づいて解決策を見つけました。これが私がそれに対処した方法です：

3 つのコンテナー div と、可変数の子 div のリストを使用します。

  • 「ページ」div。内容:
    • 「コンテンツ」部門。内容:
      • 「カテゴリー」部門。内容:
        • 可変数の子 div

（コードを適切に追加するのに夢中になっているので申し訳ありませんが、画像として含めます）

説明は次のとおりです。

  • 3 つのコンテナー div の元の高さを維持する変数をいくつか定義します。後で、含まれる子 div の数に応じて必要な追加の高さを追加できます。

  • それらの値が空かどうかを確認して、最初にのみ値を割り当てるので、ユーザーがページにアクセスするたびに高さを追加し続けることはありません。

  • 各子 div の高さは 40 ピクセルなので、これを変数に追加して、高さの合計増加量を累積します。

最後に、コンテナーの高さを更新すると、コンテンツ全体が表示されます。

とにかく、私の疑問は次のとおりです。動的な高さで作業する必要があるたびに、本当にそれを行う必要があるのでしょうか?
動的コンテンツに応じてコンテナーの高さを増やす方法が他にないと考えるのは難しいです。

誰でもこれを理解するのを手伝ってもらえますか?

4

1 に答える 1

1

あなたが説明しているように、次のようにdivタグを別のdivタグに追加しています：

<div id="container">
     <div></div>
     <div></div>
     <div></div>
     test
</div>

追加の div タグは、#container に高さを追加しません。

これがあなたがしていることなら、あなたは余分な高さを得ることはありません.

#container 内により多くの高さをロードしたい場合は、さまざまなアプローチでそれを行うことができます。

  1. jQueryで

    $("#container").css("height", "100px");

  2. CSSあり

    #container {
   height: 100px;
}

div#container にさらに高さを追加したい場合は、次の操作を実行できます。

$("#container").click(function() {
    var height = $("#container").height();
    height = height + 10;
    $("#container").css({"height": height+"px"});
    /* do more here if you want :) */
});


<div id="container" style="background-color: red;">
   test
</div>
于 2012-12-20T01:25:52.670 に答える