0

親 div の高さを子 div の最長のテキストの長さに調整する必要があるという問題がありますが、行内のすべての div をテストして最長のテキストを見つけ、その幅を値として使用する必要がありますその行のすべての親 div の高さ。次に、クラス名「row-1」を次の行、つまりrow-2に選択して開始し、それらすべてをループして高さを設定するjQueryセレクターをインクリメントする同じループ関数が必要です...そして3番目にサーバー側のクエリによって返されたすべての行がテストされ、行の高さが調整されるまで、row、row-3 など。奇妙に聞こえますが、次のようになります。

http://ccs.btcny.net/redhook/

PHP を使用して行を作成し、クラス名を追加しています。マークアップをクリーンかつ高速に出力する関数があります。

ただし、これが PHP に役立ち、全体的なロジックは次のようになります。

最初の行の 1 つのアイテムから開始し、すべてのアイテムが取得されるまでクエリをループしながら、各行に 1 つのアイテムを追加します。新しい行が作成されると、すべてが縮小されます。

以下の jquery 関数を行ごとに実行していましたが、すべてのアイテムが取得されるまでループ関数が 1 つ必要です。これが私が達成できたことです:

$('.row-1 div.article-list-title').each(function() {
            maxWidth = maxWidth > $(this).width() ? maxWidth : $(this).width();

            var titwidth = $(this).width();
            console.log(titwidth);
            });

        $('.row-1').each(function() {
              $(this).height(maxWidth);
            });
$('.row-2 div.article-list-title').each(function() {
            maxWidth = maxWidth > $(this).width() ? maxWidth : $(this).width();

            var titwidth = $(this).width();
            console.log(titwidth);
            });

        $('.row-2').each(function() {
              $(this).height(maxWidth);
            });

/* And so on */

どんな助けでも大歓迎です!

助けてくれてありがとう!

4

1 に答える 1

0

私はあなたがこれで何をしようとしているのかについて十分に知っているとは思わないので、「私はこのようにはしないだろう」というスピーチを保存します.

それにもかかわらず、これはあなたが望むものを与えると思います(使用したいのがjQueryの場合)。

heights = new array();
/** Loop through the title classes **/
$('div.article-list-title').each(function(){
  var $this = $(this),
    currentRow = $this.parent(),
    x = 1;
  /** Match the parent row class name **/ 
  while(! currentRow.hasClass("row-"+ x)) x++;
  if (heights.length < x) heights[x] = 0;
  if ($this.width() > heights[x]) heights[x] = $this.width();
});
/** Now update all the row-x class heights **/
for (var y = 1; y <= heights.length; y++) {
  $(".row-"+y).height(heights[y]);
}

に注意してwhile(! currentRow.hasClass("row-"+ x)) x++;ください。article-list-title要素に親row-xクラスの要素がない場合、永遠にループします

于 2012-10-02T00:40:19.353 に答える