[JS]テーブルにアニメーションを伴ったページネーション機能を加えるスクリプト -Table Paginator
既存のテーブルにも簡単に組み込める、テーブルに美しいフェードのアニメーションを伴ったページネーション機能を加えるjQueryのプラグインを紹介します。 Table Paginator デモ [ad#ad-2] デモはシンプルに実装されたテーブルの上にある「Click to Pagenate」をクリックすると、長いテーブルがページネーション付きのテーブルに変更されます。 テーブルの下部に配置されたナビゲーションをクリックすると、フェードのアニメーションで指定されたテーブルが表示されます。 美しいグラデショーンを伴ったフェードのアニメーション ※デモで実際のアニメーションをお楽しみください。 Table Paginatorの主な特徴 既存のテーブルにも簡単に実装できます。 美しいインターフェイスを提供します。 インターフェイスはjQuery UIのテーマを継承します。 アニメーションのスピード
少しのjQueryコードでHTMLテーブルの列にリンク先を指定できるようにする
列全体がクリック可能で、Wikipediaに飛びます。セル内にアンカータグが含まれている場合はそちらが優先されます。Webサービスの料金プランなんかに使えそうでは。 jQuery( function($) { $('tbody tr[data-href]').addClass('clickable').click( function() { window.location = $(this).attr('data-href'); }).find('a').hover( function() { $(this).parents('tr').unbind('click'); }, function() { $(this).parents('tr').click( function() { window.location = $(this).attr('data-href'); }); });
ヘッダ固定の分かりやすいテーブルを簡単実装できるjQueryプラグイン「jQuery.FixedTable」:phpspot開発日誌
ヘッダ固定の分かりやすいテーブルを簡単実装できるjQueryプラグイン「jQuery.FixedTable」 2011年02月16日- jQuery plugin: jQuery.FixedTable - Nova download ヘッダ固定の分かりやすいテーブルを簡単実装できるjQueryプラグイン「jQuery.FixedTable」。 テーブルは便利ですが、左から2番目のカラムは何を意味するんだっけ？という時に下の方にスクロールしていると上まで戻らないといけなかったりしますね。 そこでテーブルヘッダを固定位置にして分かりやすくできるというもの。 テーブルの最左部を固定にしてテーブルを横長にすることも出来ます。 テーブルのヘッダを固定にして通常のテーブルっぽくすることも出来ます。 デモページ 実装も基本的に $(element).fixedTable( options ) で簡単実装
[JS]表組みのヘッダを固定し、表示する列も選択できるスクリプト
左上のアローをクリックすると、チェックボックスが表示されます。 スクリプトはクッキーにも対応しており、選択した列をクッキーに保存することも可能です。 スクリプトはjQueryのプラグインのため、実装にはjquery.jsが必要です。 オプションでは、テーブルの幅と高さ、列選択の有無、クッキーの有無を設定できます。基本の書式は下記のようになります。 JavaScript <textarea name="code" class="js" cols="60" rows="5"> $(tableID).scrollableFixedHeaderTable(widthpx, heightpx, showSelect, cookie) </textarea>
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA