問題タブ [equal-heights]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
6783 参照

jquery - jQueryで3つの等しい高さの列をブートストラップするには、jsの支援が必要です

私は同じ高さのためにjQueryのこのビット(jQuery equal height Respond div rows)を使用してきましたが、非常にうまく機能しますが、BS2とBS3で同じパターンが使用されている場合、行をスキャンして同じ高さにしません、ページ自体をスキャンし、同じページのすべてのパターン (row > col- )がページで最も高い高さを取得します。それは望ましい実装ではありません。

http://jsbin.com/aVavuLeW/14/

上記の JSBin には、BS3 列 (そのコピー) で動作する例があります。スタッキング ポイントで列の相対位置を設定することはできないため、これらはこのビンの目的でコピーされています。ご覧のとおり、各行 (この例では .foo と .foo2) に異なるクラスを作成すると、列は動作しますが、同じパターンを使用することにした場合、ページで最も高い高さが引き継がれます。

質問: 同じパターンを使用すると、行ではなくページに基づいて計算されるという問題を解決するにはどうすればよいですか?

ありがとう!!!

0 投票する
2 に答える
127 参照

jquery - 動的に追加されたクラスの高さが等しい

呼び出して実行する等高スクリプトがあります

マークアップは

これには無限の数のグリッド行が含まれる可能性があり、新しいグリッド行ごとに、cms は行クラスに追加される数を増やします。

$(".rowX").equalCols(); を追加し続けたくありません。私のdoc.ready関数への呼び出し - 行で始まるクラスを見つけて、それらすべてを同じ高さの呼び出しでループしようとしました - $(".row[x]"). equalCols(); のようなもの しかし、非常に混乱しています。これを解決するための助けは素晴らしいでしょう! 前もってありがとうジェームズ

0 投票する
1 に答える
181 参照

html - 同じ高さの列は Chrome でのみ機能します

同じ高さに伸びる 3 つの列があります。問題は、Google Chrome でしか動作しないように見え、少なくとも Safari や FF では動作しないことです。また、iPad の Chrome や Safari でも機能しません。

ここでそれらの動作を確認してください

面白いことに、このFiddle の例では、まったく同じコード (見やすくするために境界線を変更しただけ) を用意しましたが、すべてのブラウザーで動作するようです。

これを修正する方法はありますか?どうもありがとう!

HTML

CSS

0 投票する
1 に答える
134 参照

html - 同じ高さの列の余白が機能しない

同じ高さに伸びる3つの列があります。唯一の問題は、各列の間にギャップが必要なことです。

フィドルのデモ

float:left を #wrapper > .col (以下を参照) に配置しようとしましたが、うまくいきましたが、列の高さが台無しになります。

この問題を解決する方法はありますか?

CSS

0 投票する
2 に答える
210 参照

jquery - jQuery関数は最初のページの読み込みではトリガーされませんが、更新時には正常にトリガーされます

以下の関数を使用して、グリッド行に同じ高さの列を設定しています。最初のページ読み込み時に、関数は高さ '0' を に設定しdiv.gallery-itemます。更新すると、関数は適切に起動し、関数で設定された高さを割り当てます。

スクリプトは次のとおりです。

これは、関数のロード方法と関係があることを知っています。このスクリプトを使用した記事のアドバイスは、window.onload画像が列のさまざまな高さを設定するものである場合に使用することでしたが、以下のようにスクリプトの最後の部分にそれを追加しようとしましたが、関数は機能しませんまったくトリガーします。

何かアドバイス?