jQuery-ResizableColumnsは、テーブルのカラムをリサイズできるjQueryプラグインです。カラムの端辺りにカーソルを合わせてドラッグすることでサイズを調整できます。ユーザーが見やすいように自分で変更できるのはとても便利ですね。
jQuery-ResizableColumns
以下のページからjQuery-ResizableColumnsの実際のデモに触れることができます。
デモではSubject、Sem1、Sem2、Sem3と4つの列があるテーブルが設置されています。例えば、SubjectとSem1の間あたり(少しSubject寄り)にマウスカーソルを合わせると、カーソルのアイコンが変化します。この状態で左右にドラッグすることでカラムのサイズを調整できる仕組みです。
Subjectに入っている項目は、長めのテキストになっているのでカラムのサイズが短いと全てを表示させることができません。こういった状況で、カラムをリサイズすることができればテキストを簡単に確認できるのでユーザーにとっては助かる機能ですね。
デモではテーブル全体のサイズは変わらず、テーブル内のカラムのサイズを個別に調整できるようになっています。テーブル全体のサイズがそのままなら、ページのレイアウトが崩れる心配もないので安心ですね。
マークアップや使い方もシンプルに実装できるほか、ファイル容量もかなり軽量に仕上がっているので、気になる方はぜひ「jQuery-ResizableColumns」をチェックしてみてくだくさい。jQuery-ResizableColumnsの具体的な実装方法やダウンロードは以下のページからどうぞ。