jQuery Resizable Columns

JavaScript

テーブルの列の幅をドラッグでサイズ変更できる「jQuery Resizable Columns」

じっくりテーブル内の情報を見たい時なんかに便利そうですね。テーブルの列幅をドラッグで好きなサイズに変更できる「jQuery Resizable Columns」です。列の境界線にマウスを乗せるとカーソルが変わるので、そこでドラッグして幅のサイズを調整することができます。

[ads_center]

使い方

実際のデモでは以下の境界線付近をドラッグして幅のサイズを変更することができます。

jQuery Resizable Columns

使い方もとてもシンプルですね。

<script>
$(function(){
    $("table").resizableColumns({
        store: store
    });
});
</script>

自由度の高いテーブルを実装したい時に覚えておきたいですね。

Feedlyでカテゴリーのフォルダ名を変更Feedlyでカテゴリーのフォルダ名を変更するやり方前のページ

Amazon以外のサイトからでもAmazonのほしい物リストに追加できるChrome拡張機能次のページAmazon.co.jpのほしい物リストに追加

関連記事

  1. Thumbelina

    JavaScript

    サムネイル画像のギャラリーに最適なコンテンツスライダー「Thumbelina」

    Thumbelinaは、サムネイル画像に最適なコンテンツスライダーを実…

  2. jQuery Sequency js

    JavaScript

    スクロールでビフォー・アフター画像を見比べれる「jQuery Sequency js」

    jQuery Sequency jsはスクロールでビフォー・アフター画…

  3. CircularLoader.js

    JavaScript

    シンプルな円形プログレスバーを簡単に実装できる「CircularLoader.js」

    CircularLoader.jsは円形プログレスバーを簡単に実装する…

  4. photowall

    JavaScript

    Google画像検索のようにサムネイル画像をクリックするとスライド表示されるjQueryプラグイン「…

    Google画像検索のようなアニメーションを実装することができるjQu…

  5. normalmap.js

    JavaScript

    インタラクティブなライティングエフェクトを実装できる「normalmap.js」

    normalmap.jsはシンプルでインタラクティブなライティングエフ…

  6. nanogallery2

    JavaScript

    美しくてハイクオリティなイメージギャラリーを実装できる「nanogallery2」

    nanogallery2はパーソナルニーズにピッタリなイメージギャラリ…

コメント

    • chocochip
    • 2013年 8月 04日

    こんにちは。
    chocochipと申します。
    こちらはプラグインと異なり、記載の$(function以下の呼び出しのみで使えるのでしょうか。テンプレート内で実装してみたのですが、反映されず戸惑っています。

    宜しくお願い致します。

    • こんにちは。
      こちらはjQueryなので本体とダウンロードしたプラグインファイルを読み込んでおく必要があります。

  1. この記事へのトラックバックはありません。

最近の記事

  1. TR153
  2. cheero Flat 10000mAh with Power Delivery 18W CHE-112
  3. SV-S251
  4. スラウェシ トラジャ

アーカイブ

PAGE TOP