表の列のドラッグの幅

問題

一般的な表の列は、動的に列の幅を変更する、すなわち、ユーザの操作の幅を変更することができません。

時には、複数列のコンテンツがあり、ショーはいくつかの列の内容がディスプレイの小さな、あまりない幅で、十分ではありませんが、コンテンツは、コーディング段階で決定することができない、動的です。

テーブルのだから、提案の幅は、需要の幅を変更するためにドラッグすることができます。

 

ブートストラップ表

このスタイルライブラリテーブルのスタイルは、フレンドリーなショーを提供していますが、テーブルの幅をドラッグすることができますサポートしていません。

https://bootstrap-table.com/

ブートストラップ表

最も広く使用されているCSSフレームワークの一部との統合への拡張テーブル。（ブートストラップ、セマンティックUI、ブルマ、材料設計、財団をサポートしています）

ブートストラップ表は、開発時間を短縮し、開発者からの具体的な知識を必要としないように設計されています。それはフェザー級で機能豊富な両方です。

 

 

あなたは、プラグインをドラッグすることができます

https://examples.bootstrap-table.com/#extensions/resizable.html

 

https://github.com/dobtco/jquery-resizable-columns

 

jqueryの - サイズ変更可能な、列

jQueryのためのサイズ変更可能な表の列。ライブデモ

新しくなり改善された！ 今テストされ、あまりにもうまくいくかもしれないクローム＆Firefoxのは（Mac + Windowsの場合）、およびIE 9つの+ 10他のブラウザで作業し、ちょうどチェックする時間がありませんでした。

サイズ： <8キロバイト縮小さ

 

依存関係

• jQueryの
• store.jsのlocalStorageの永続性のための（または類似のもの）。

 

シンプルな使い方

<table>
  <thead>
    <tr>
      <th>#</th>
      <th>First Name</th>
      <th>Last Name</th>
      <th>Username</th>
    </tr>
  </thead>
  <tbody>
    ...
  </tbody>
</table>

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