12

TOP行とLEFT列がフリーズしているが、テーブルの残りの部分はスクロール可能であるHTMLでスクロール可能なテーブルを実装できる人はいますか？これの完璧な例は次のとおり です。GoogleSquared

グーグルの二乗テーブルのコードをリバースエンジニアリングしようとしましたが、これまでのところ成功していません。

注：上段と左列を同時にフリーズする機能が必要です。

4

5 に答える 5

3

http://ajaxian.com/archives/freeze-pane-functionalityに、簡単に複製できる実用的な例があります。コメントに注意してください。多くのユーザーが、スクリプトを改善するための有益な提案を行っています。

@Nirk のリクエストにより、アクティブなデモへの直接リンクはhttp://www.disconova.com/open_source/files/freezepanes.htmにあります。

于 2009-07-08T23:06:07.850 に答える
1

このような基本構造で行きます-

table
  row
    column (blank)
    column
      table (1 row high, column headers)
  row
    column 
      table (1 column wide, row headers)
    column
      div (fixed height & width, overflow auto)
        table (actual data)

固定のテーブル レイアウトを設定し、列幅をピクセル単位で明示的に指定します。同じ効果を達成できるはずです。

于 2009-07-08T22:39:48.670 に答える
0

これのバージョンを使用しています（ガントチャートスタイルの表示用）。

3 つのテーブルを使用します。1 つは左側の列 (行)、1 つは上部 (列)、そしてデータです。

セルが一致するサイズと一致するようにセルを取得するために一生懸命働く必要があります（ table layout-fixedこれを達成するのに役立ちます）。

次に、テーブルはいくつかの div に配置されます。左と上の div には (上で提案したように) 高さと幅がありoverflow-auto、それらの css にあります。

次に、JavaScriptを接続して、左/上のdivのスクロールを内側のdivと同期させます...

私が覚えているように、かなりの「呪いの再試行」がありましたが、最小限の js で実行できます。

h番目

于 2009-08-22T09:07:48.440 に答える
-1

jQuery を使用する場合、固定ヘッドのテーブル用のプラグインがたくさんあります。

于 2009-07-08T22:25:09.230 に答える
-1

Scrollable (jQuery プラグイン)が必要です

デモはこちら

于 2009-07-08T22:57:01.287 に答える