HTML Table with Fixed header, Resizable Columns and can size to less than the content width [closed]

Question

I'd like to include a table in my web application thing that has a fixed, styled, header AND resizable columns AND to be able to resize the columns (both by when the browser is resized as the table is 100% and by the user resizing the columns) to less than the content and the content get truncated (hidden).

Also somehow I'd like the body of the table (not the header) to scroll if it can't all fit.

At the moment, I don't care if it doesn't work in every browser, I just need it to work in a webkit-based browser.

I've tried lots of different combinations, including tons of jQuery plugins, displaying the header bits as display:block and then using jQuery resize, and even the CSS3 resize value, all not providing all these features I need.

Does anyone know of something that supports this, or has code to make this happen?

Answer 1

You can use this jQuery plugin: https://github.com/benjaminleouzon/tablefixedheader

It's the only plugin of "fixed header table" without width fixing and without body resizing observers!

You can easy customize the table with theme files.

Disclaimer: I am the author of the plugin.