Googleスプレッドシートをtable要素としてWebサイトに埋め込むスクリプト・「Sheetrock」SheetrockはPublic設定されているGoogleのスプレッドシートを照会、取得し、table要素として任意のWebサイトに表示出来るスクリプトです。jQueryに依存しています。スプレッドシートの内容は選びそうですが、単純なデータなら親和性ありそうですね。ライセンスはMITとの事です。 Sheetrock
div、table、ulリスト等にソート、ページネーション、フィルタ機能を追加できる「jPList」:phpspot開発日誌
Overview | jPList - jQuery Data Grid Controls div、table、ulリスト等にソート、ページネーション、フィルタ機能を追加できる「jPList」。 div、table、ulなどで列挙されたデータに、次のようなインタフェースを追加して、便利にしてくれるというもの。 既存のHTMLにソートやフィルタなどの機能拡張したい場合に使えそうです。 関連エントリ アイテムをクールにアニメーションしつつフィルタ・ソートが出来るjQueryプラグイン「MixItUp」 リストやテーブル、DIV等の要素を好みにJSでソートできるjQueryプラグイン「SortedList」 テーブルに検索、ソート、ページ分け機能をつけて便利にしてくれる「Dable」
テーブル行のハイライトに便利なjQueryプラグイン「wholly」:phpspot開発日誌
gajus/wholly GitHub テーブル行のハイライトに便利なjQueryプラグイン「wholly」。 テーブルのカレントの行がハイライトされると分かりやすいですが、それを簡単に実装できるようです。 colspanをつかったような複雑なテーブルでのハイライトにも対応 関連エントリ 複数条件で結果を絞り込めるテーブルを実装できるjQueryプラグイン「Multifilter」 インライン編集できるテーブル実装用jQueryプラグイン「editable-table」 テーブルを様々なグラフに自動変換できるjQueryプラグイン「HighchartTable」 テーブルをグラフに変換できるjQueryプラグイン「TableBarChart」
[JS]一味違ったアイデアでレスポンシブ対応のテーブルを実装するスクリプト -Responsive tables
サイズが変更されても、ハイライト表示はできます。 Responsive tablesの使い方 Step 1: スタイルシート スタイルシートをhead内に外部ファイルとして記述します。 <head> ... <link rel="stylesheet" href="css/rwd-table.min.css"> </head> Step 2: スクリプト スクリプトを</body>の上あたりに記述します。 <body> ... <script type="text/javascript" src="js/rwd-table.js"></script> <script> $(function() { $('.table-complex').responsiveTable({ adddisplayallbtn: true, addfocusbtn: true, fixednavbar: '#n
HTML5＋JSONでインタラクティブなテーブルを作れる「Dynatable.js」:phpspot開発日誌
Dynatable.js - jQuery plugin for HTML5 JSON interactive tables and more HTML5＋JSONでインタラクティブなテーブルを作れる「Dynatable.js」 JSONからtable、tableからJSON形式に変換でき、実装できるテーブルもソートしたり件数を絞り込めたり検索できたりと、リッチにしてくれ、かつシンプルなデザインで使いやすいテーブルが作れるライブラリです。 tableはデータと密接な関係にあることが多いですから、こういうライブラリは結構使えそうです。 関連エントリ テーブルを折りたたみ可能なツリー型グリッドに変換できる「TreeGrid」 普通のテーブルをExcel風に超カッコよくしてくれるjQueryプラグイン「ParamQuery」 テーブル行をインクリメンタル検索できるようにするjQueryプラグイン
tableをスマホ用に変形
デスクトップ用にtableで実装された表組みをスマフォでも最適に見えるよう変更するjQueryのプラグインを紹介します。 既存のテーブルにも簡単に対応でき、しかも1KBと超軽量です。 デモページ：幅480pxで表示 左：ヘッダ有り、右：ヘッダ無し 一つのアイテムに対して、それぞれ対応する項目が配置されるようになっています。 ReStableの使い方 Step 1: 外部ファイル jquery.jsと当スクリプト・スタイルシートを外部ファイルとして記述します。 <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript" src="jquery.restable.min.js"></script> <link rel="
IE7 が死んだらできるいくつかのこと（ caniuse.com から見繕っただけ） - oogatta のブログ
IE6 への対応が一段落した昨今、 IE7 もいよいよ事実上市場から姿を消す日が近づいてきたようです。flickr が今年以降リリースする新機能にて IE7 をサポートしないことを表明しました。私の勤務先でも、今ものすごい勢いで IE7 のシェアが低下しており、今年の夏から冬にかけて、今の IE6 と同じくらいのシェアになるかもしれない勢いです。 というわけで、 IE の最低動作保証バージョンが 7 から 8 になったら何ができるようになるのか、僕らの caniuse.com を見てざっと洗い出してみましたのでご参照ください。 CSS inline-block display:inline-block が使えます。IE 6/7 では "display:inline; zoom:1;" で代用していたと思います。 Table Display display:table 、 display:t
ソートやフィルタにも対応したレスポンシブなテーブル·FooTable MOONGIFT
FooTableはレスポンシブなテーブルデザインを行うライブラリです。 レスポンシブWebデザインにおける最大の難関はテーブルかも知れません。PCならば幅広く表示できたカラムがスマートフォンではうまく表示しきれません。そこで使い勝手を維持しつつ見栄えもいいテーブル表示にFooTableを使ってみましょう。 PCで表示したテーブル。 スマートフォン向けに縮めた場合。+記号が表示されています。 +記号をクリックすると、追加情報が表示されます。 HTMLを組み合わせた行。 こちらでもスマートフォンで表示できます。 タブレットでも調整されて表示されます。 ソート機能版。 もちろんスマートフォンでもソートが使えます。 フィルタリング。インクリメンタルに適用されます。 PCでももちろん使えます。 ソートとフィルタリングは同時に使えます。 FooTableを使う際にはタブレットやスマートフォンで表示する
tableの行と列を固定してスクロール！！Super Tables | バシャログ。
6月に入り、欧州サッカーの移籍情報が気になってしょうがないishidaです。 WEB制作に携わっていると、表組みだらけのWEBサイトの担当に 長い人生に一度や二度はなる（?）と思います。 tableによる表組みは、行や列が増えすぎるとコンテンツからはみ出したりして 見栄えが悪くなりますよね。 そんな迷える子羊たちを助けてくれるjavascriptライブラリ Super Tables を今回ご紹介いたします。 まずは以下のサンプルをご覧くださいませ。 Super Tables サンプルデモ サンプルのような感じで、ヘッダー部分を固定したり、列を固定できます。 Super Tables 設置方法 配布ページよりデータをダウンロードし、利用したいhtmlのhead要素などでファイルを読み込みます。 <link rel="stylesheet" href="superTables.css" typ
HTMLのテーブル（table）を行列固定でスクロールさせる
技術屋さんの視点からは「結構キツイな～」と思うことでも、お客様からは「えっ！？それぐらいできないの？」なんて思われることが結構あります。 その代表格はtableをExcelっぽくして欲しい、という要望ではないでしょうか。 なまじっかGooleDocsなんてものがあったりするのでExcelを日常的に使用されているお客様はWEBでもそのようなI/Fを求められます。 ExcelっぽいHTMLテーブル、、 結構キツイのよね・・・。 Flash使える場合はその方向になりますが、1画面だけ、なんて要件でしたらJavascriptで何とかしたい。 JSでテーブルをExcelっぽくするライブラリには、まとまったものではYahooUIやDojoがありますが、行列を固定したスクロールは調べた限りでは出来なさそうでした。 そんな時のJSライブラリ。 ・Super Tables http://www.matts4
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
HTMLテーブルを JSON、XML、PNG、CSV、PDFなどあらゆる形式に変換できる「HTML table Export」:phpspot開発日誌