180style wiki
システム関連/JavaScript/便利なライブラリ/テーブルのセルをハイライト
をテンプレートにして作成
開始行:
*テーブルのセルをハイライト - Tablecloth [#b1fc2ef4]
-http://cssglobe.com/lab/tablecloth/
**サンプル [#q551281d]
-http://180xz.com/other/js/tablecloth/tablecloth.html
&br;(行列ともにハイライト 選択セルの行列の色変え有)
-http://180xz.com/other/js/tablecloth/tablecloth.css
**使い方 [#ocdfba90]
-tablecloth.js
スクリプトの最初の方にCONFIGがあります。
true か false を設定します。
// テーブルの列をハイライト表示するかどうか
var highlightCols = true;
// テーブルの行をハイライトするかどうか
var highlightRows = true;
// 対象のセルをクリックした時にクリックしたセルの行列の...
var selectable = true;
-cssの設定(サンプルでの設定例)
データセルの表示をみやすい様に奇数行と偶数行で色違いにで...
/* データセル(奇数行) */
tr.even td {background:#EFF;}
/* データセル(偶数行) */
tr.odd td {background:#DFF;}
/* マウスオーバー */
th.over, tr.even th.over, tr.odd th.over {background:#39...
td.over, tr.even td.over, tr.odd td.over {background:#FF...
/* クリック(ボタンダウン) */
td.down, tr.even td.down, tr.odd td.down{background:#339...
/* 選択された項目 */
td.selected, tr.even td.selected, tr.odd td.selected{bac...
/* 空のセルの背景 */
th.empty,td.empty, tr.odd td.empty, tr.even td.empty{bac...
終了行:
*テーブルのセルをハイライト - Tablecloth [#b1fc2ef4]
-http://cssglobe.com/lab/tablecloth/
**サンプル [#q551281d]
-http://180xz.com/other/js/tablecloth/tablecloth.html
&br;(行列ともにハイライト 選択セルの行列の色変え有)
-http://180xz.com/other/js/tablecloth/tablecloth.css
**使い方 [#ocdfba90]
-tablecloth.js
スクリプトの最初の方にCONFIGがあります。
true か false を設定します。
// テーブルの列をハイライト表示するかどうか
var highlightCols = true;
// テーブルの行をハイライトするかどうか
var highlightRows = true;
// 対象のセルをクリックした時にクリックしたセルの行列の...
var selectable = true;
-cssの設定(サンプルでの設定例)
データセルの表示をみやすい様に奇数行と偶数行で色違いにで...
/* データセル(奇数行) */
tr.even td {background:#EFF;}
/* データセル(偶数行) */
tr.odd td {background:#DFF;}
/* マウスオーバー */
th.over, tr.even th.over, tr.odd th.over {background:#39...
td.over, tr.even td.over, tr.odd td.over {background:#FF...
/* クリック(ボタンダウン) */
td.down, tr.even td.down, tr.odd td.down{background:#339...
/* 選択された項目 */
td.selected, tr.even td.selected, tr.odd td.selected{bac...
/* 空のセルの背景 */
th.empty,td.empty, tr.odd td.empty, tr.even td.empty{bac...
ページ名: