javascript - 表のセルをレスポンシブにし、それらを均等に正方形にして、ウィンドウを埋めます

Question

テーブルセルをレスポンシブにしたい-利用可能なすべてのスペース(ウィンドウ)を埋める四角形でも。表の幅が 100% の場合 - 使用可能なすべてのスペースを使用し、セルを均等に配置しますが、水平方向にのみ配置します。ウィンドウのサイズ変更イベントでこの関数を呼び出して、jquery で小さな JavaScript を作成しました。

function windowReszie(){
 $("td").each(function(){
    $(this).css({"height":$(this).width()});
  })
}

しかし、私はたくさんのセルを持っているので、このアプローチは遅いです.cssまたは他のより良い、より速い方法でそれを行う方法はありますか?

Answer 1

I see some problem with your approach, you're computing the width for every cell.

I'd do something along the lines of

function windowReszie(){
  var size =$("td").width();
  $("td").height(size);
}

Another approach would be to set a class and change the css rule associated with the class, but that could be a bit tricky (see : Changing a CSS rule-set from Javascript)

Answer 2

<td>最初にクラスを追加<tr>してから、そのクラスをループしてみてください...すべての<td>項目をチェックする必要はありません。