Fork me on GitHub

jQuery Resizable Columns Demo

Grab the column headers and drag em! Bonus: refresh the page.
# First Name Last Name Username
1 Mark Otto @mdo
2 Jacob Thornton @fat
3 Larry the Bird @twitter
      <script src="libs/jquery.js"></script>
      <script src="libs/store.js"></script>
      <script src="jquery.resizableColumns.js"></script>

      <table class="table table-bordered" data-resizable-columns-id="demo-table">
        <thead>
          <tr>
            <th data-resizable-column-id="#">#</th>
            <th data-resizable-column-id="first_name">First Name</th>
            <th data-resizable-column-id="last_name">Last Name</th>
            <th data-resizable-column-id="username" data-noresize>Username</th>
          </tr>
        </thead>
        <tbody>
          ...
        </tbody>
      </table>

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