横（水平）スクロールを分かりやすく伝えてくれる『ScrollHint』
今回は、横に長ーい表組（テーブル）を表示する際に便利なJavaScriptライブラリ「ScrollHint」を紹介します。 レスポンシブデザインでのテーブルの見せ方にいつも悩む… レスポンシブデザインで設計する際、PCとスマートフォンではディスプレイサイズが大きく異なり、表組（テーブル）をどう表現するかはユーザビリティに少なからず影響します。 項目の少ないテーブルでは問題ないのですが、ボリューム満点のテーブルの場合、PCでは無理なく表示できてもスマートフォンだと収まりきれない。収まってもそのままでは、読みづらく実用に耐えないことも多々あります。 そういった際の対策として、以下の様なものがあります。 ① overflowを指定して、テーブルの横（水平）スクロールを実現する ② tableの関連要素をblock要素に変換して、セルを縦に並べる ③ スマートフォンのみ、優先度の低い項目（セル）を
Tabulator - Interactive JavaScript Tables
Easy to use, simple to code, fully featured, interactive JavaScript tables and data grids Download v5.5 HTML <div id="example-table"></div> JavaScript - Simple Table //define data array var tabledata = [ {id:1, name:"Oli Bob", progress:12, gender:"male", rating:1, col:"red", dob:"19/02/1984", car:1}, {id:2, name:"Mary May", progress:1, gender:"female", rating:2, col:"blue", dob:"14/05/1982", car:t
ExcelからHTMLテーブル変換 Ver.2
インデント trとtdの改行 テーブル表現 セル内改行 thやdtの使用 セル内のタグ リンク 画像 class style width height valign align cellspacing cellpadding border class, style, width, height, valign, align, cellspacing, cellpadding, border 等はExcelコピーで保持される内容がそのまま出力されます。 borderやその他多くの書式はclassで定義されています。(スタイルシートは別途記述が必要)
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
