タグ

テーブルに関するkuroaka1871のブックマーク (3)

  • HTMLでブラウザの表示幅が狭い時にテーブルの右側が切れるのを防ぐ

    B! 31 0 0 0 Octopressでブログを書く時に Markdown記法でテーブルを書くことが出来ますが、 そのままtableを使うと幅が大きい時に右側が切れてしまうことがあるので ちょっと調整。 テーブル調整 テーブル調整 やったことはtable要素をscroll: overflowのスタイルを持った div要素で囲っただけ。 ただし、Markdownからテーブルを作るに辺り、 再生時に要素を入れるのが難しいので 表示する時にJavaScriptで入れるようにしました。 Markdown記入時にテーブルの上下に<div>を書いてしまうと 今度はMarkdownとして認識されなくなってしまうので直接書くことは出来ません。 (勿論、テーブルをHTMLで書いてしまうことは可能ですが。) 既に書いてある所も書き換えるのは大変なので安易にJavaScriptで挿入、ということで。 Jav

    HTMLでブラウザの表示幅が狭い時にテーブルの右側が切れるのを防ぐ
  • Sticky Table Headers & Columns - ヘッダー、見出しを固定表示するHTMLテーブルライブラリ MOONGIFT

    業務システムではテーブルがよく使われますが、大量のデータを表示するとカラムが見えなくなっていったりきたりする操作が発生します。それはユーザにとってストレスで改善要望を出されること請け合いな訳ですが、丁度自分たちのシステムにあったものを探すのは大変です。 さらに業務システムがスマートフォンからも使いたいなんて言われたらどうしたら良いでしょう。そこで紹介したいのがSticky Table Headers & Columns、横に長いテーブルにも対応したヘッダー追従テーブルライブラリです。 デモです。こういった感じのテーブルがあったとします。 スクロールしてもヘッダーがついてきて常に一番上に固定されます。 続いて左側のカラムも固定されるパターン。これも顧客名やIDを常に出しておくとデータの確認がしやすくなります。 幅が広いテーブルでも右側にスクロールできるので問題ありません。 Sticky Ta

    Sticky Table Headers & Columns - ヘッダー、見出しを固定表示するHTMLテーブルライブラリ MOONGIFT
  • テーブルを様々なグラフに自動変換できるjQueryプラグイン「HighchartTable」:phpspot開発日誌

    jQuery HighchartTable plugin テーブルを様々なグラフに自動変換できるjQueryプラグイン「HighchartTable」 通常のテーブルに指定されたルールをちょっと追加してプラグインで初期化するだけでグラフに変換してくれます。 ライブラリにJSONでグラフデータを渡してあげるようなライブラリも多くありますが、テーブルを作るだけでいいっていうのは割と楽で使いやすいですね 関連エントリ 普通のテーブルをExcel風に超カッコよくしてくれるjQueryプラグイン「ParamQuery」 フラットデザインがクールな円グラフ描画jQueryプラグイン「Pie Chart」 線グラフを描くだけの軽量グラフ描画JS「Aristochart」

  • 1