jQuery插件來調整表列的大小
官網地址：http://www.bacubacu.com/colresizable/
github項目地址：https://github.com/ybx13579/resize-table-th
效果圖：
colResizable
colResizable是一個免費的jQuery插件，旨在通過手動拖動列錨點來增強任何類型的HTML表對象，從而增加列重新調整大小的功能。它兼容鼠標和觸摸設備，並具有一些不錯的功能，如頁面刷新或回發後的佈局持續性以及與百分比和基於像素的表格佈局的兼容性。它的體積很小（colResizable 1.0只有2kb），它與所有主流瀏覽器（IE7 +，Firefox，Chrome和Opera）完全兼容。
用法
要使用此插件，一旦jQuery被加載，腳本引用必須被添加到文檔的頭部分中的colResizable.min.js文件中。爲了增強一個表（或表的集合），用jQuery包裝器指向它並應用colResizable（）方法。
$(function(){
$("table").colResizable();
});
屬性
resizeMode：[type：string] [default：’fit’] [version：1.6] [values：’fit’，’flex’，’overflow’]
它用於設置resize方法的工作原理。那些是可能的價值觀：
‘fit’：這是默認的調整大小模型，其中調整列的大小不會改變表寬度，這意味着當列擴展時，下一個縮放。
‘flex’：在此模式下，如果父容器中有足夠的空間，表可以更改其寬度，每列可以獨立縮小或擴展。如果沒有足夠的空間，列將會調整其寬度。表不會比其父母大得多。
‘overflow’：允許使用父容器溢出來調整列的大小。
disable：[type：boolean] [default：false] [version：1.0]
當設置爲true時，它旨在將所有以前添加的增強功能（如事件和此插件分配的其他DOM元素）刪除到單個或集合的表中。在使用JavaScript從文檔對象樹中刪除之前，還需要先將colResized表禁用到已經colResized表的任何DOM操作之前，例如添加列，行等。
disabledColumns：[type：int of int] [default：[]] [version：1.6]
要排除的列索引數組，因此無法手動拖動。
liveDrag：[type：boolean] [default：false] [version：1.0]
當設置爲true時，將在拖動列錨點時更新表格佈局。啓用liveDrag的CPU耗費更多，因此不推薦用於較慢的計算機，特別是在處理巨大或非常複雜的表時。
postbackSafe：[type：boolean] [default：false] [version：1.3]
此屬性可用於指定在回發或瀏覽器刷新後，手動選擇的列寬度必須保持不變。此功能主要面向使用服務器端邏輯（codebehind）創建的頁面，例如PHP或.NET，它僅與具有sessionStorage支持的瀏覽器（所有現代瀏覽器）兼容。但是，如果您定位較早的瀏覽器（如IE7和IE8），則仍可以使用sessionStorage.js來模擬sessionStorage。請注意，有些瀏覽器（IE和FF）在直接從本地文件系統運行網站時不啓用sessionStorage對象，因此如果要測試此功能，建議您通過Web服務器查看網站或使用Chrome或Opera等不受此限制的瀏覽器。不要擔心兼容性問題，
partialRefresh：[type：boolean] [default：false] [version：1.5]
如果表位於updatePanel內部或使用ajax進行的任何其他類型的部分頁面刷新，則此屬性應設置爲true。表的ID在部分部分刷新之前和之後應該相同。
innerGripHtml：[type：string] [default：empty string] [version：1.0]
其目的是通過定義要在列中使用的HTML來提供一些視覺反饋來允許列錨定製。它可以以廣泛的方式用於獲得非常不同的輸出，並且可以通過將其與draggingClass屬性相結合來增加其靈活性。
draggingClass：[type：string] [default：internal css class] [version：1.0]
該屬性被用作被拖動時分配給列錨的css類。它可以用於視覺反饋目的。
minWidth：[type：number] [default：15] [version：1.1]
該值指定列允許的最小寬度（以像素爲單位）。
headerOnly：[type：boolean] [default：false] [version：1.2]
此屬性可用於防止柱錨的垂直展開以適應桌面高度。如果設置爲true，列處理程序的大小將被綁定到第一行的垂直大小。
hoverCursor：[type：string] [default：“e-resize”] [version：1.3]
此屬性可用於自定義當用戶位於列錨上時將顯示的遊標。
dragCursor：[type：string] [default：“e-resize”] [version：1.3]
定義用戶調整列大小時將使用的遊標。
flush：[type：boolean] [default：false] [version：1.3]
刷新僅在啓用PostbackSafe時有效。其目的是刪除與當前表格佈局相關的所有以前存儲的數據，以恢復其原始佈局，防止在回發後恢復寬度。
marginLeft：[type：string / null] [default：null] [version：1.3]
如果目標表包含明確的margin-left CSS規則，則必須在此屬性中使用相同的值（例如：“auto”，“20％”，“10px”）。需要它的原因是因爲大多數瀏覽器（除IE之外的所有瀏覽器）不允許直接訪問應用於其原始單元中的元素的當前CSS規則（例如“％”，“em”或“auto”值）。如果您知道任何解決方法不涉及通過網站和任何其他外部依賴關係中定義的所有樣式的迭代，請讓我知道！
marginRight：[type：string / null] [default：null] [version：1.3]
它的行爲方式與以前的屬性完全相同，但應用於右邊距。
fixed：[deprecated：use“mode”改爲] [type：boolean] [default：true] [version：1.5 only]
它用於設置resize方法的工作原理。在固定模式下，調整列的大小不會更改總表寬度，這意味着當列擴展時，下一個縮放。如果固定設置爲false，則表可以更改其寬度，每列可以獨立縮小或擴展。
注意：存在一個已知問題，其中CSS屬性table-layout: fixed;會導致與調整表寬度相關的輕微衝突。請注意，該fixed設置與CSS屬性不同，因此鼓勵不要將該樣式應用於表。
如：
$("#pendingReview_table").colResizable({
liveDrag: true,//實時顯示滑動位置
gripInnerHtml: "<div class='grip'></div>",
//draggingClass: "dragging",
postbackSafe: true,//刷新後保留之前的拖拽寬度
headerOnly:true,
//onResize: onSampleResized
});