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. Accessible Mega Menu
  2. AniX

    JavaScript

    優れたパフォーマンスと互換性を備えたアニメーションライブラリ「AniX」

    AniXは優れたパフォーマンスと互換性を備えた軽量のアニメーションライ…

  3. no-image

    JavaScript

    ミニマルなイメージギャラリーを実装できる「Albery」

    Alberyはミニマルなイメージギャラリーを実装できるjQueryプラ…

  4. jQuery cardslider

    JavaScript

    カードをスライドさせるようにコンテンツを表示できる「jQuery cardslider」

    jQuery cardsliderは、コンテンツをカードのように表示し…

  5. NO IMAGE

    JavaScript

    フレキシブルで軽量なJavaScriptモーダル実装「Vanilla Modal」

    Vanilla Modalは、フレキシブルでファイル容量も軽量なCSS…

  6. Thumbelina

    JavaScript

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

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

コメント

    • chocochip
    • 2013年 8月 04日

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

    宜しくお願い致します。

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

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

最近の記事

  1. 桜と太陽
  2. ベルボン Mシリーズ
  3. ネック冷却ファン NRF10
  4. Kindle 8GBモデル
  5. プロテクティングクロス PC-E2

アーカイブ

PAGE TOP