table表格列寬拖動功能



table表格設定爲固定的寬度、比例之後怎樣改變呢   請看下文


代碼如下:

需要引用 jquery.js colResizable-1.3.min.js

<!DOCTYPE html>
<html>
<head>
  <title>demo</title>  
<script  src="jquery.js"></script>
<script  src="colResizable-1.3.min.js"></script>
<script type="text/javascript">
$(
	function()
	{	
		var onSampleResized = function(e)
		{
			var columns = $(e.currentTarget).find("th");
		};	
	
		$("#sample2").colResizable({
			liveDrag:true, 
			gripInnerHtml:"<div class='grip'></div>", 
			draggingClass:"dragging", 
			onResize:onSampleResized});
		
	}
);	
</script>
  
</head>
<body>
	<div class="center" >
	
		 <br/><br/>
						
		
		
		
	</div>	
		
 <table id="sample2" width="100%" border="1" cellpadding="0" cellspacing="0">
	<tr>
		<td>header</td><td>header</td><td>header</td>
	</tr>
	<tr>
		<td class="left">cell</td><td>cell</td><td class="right">cell</td>
	</tr>
	<tr>
		<td class="left">cell</td><td>cell</td><td class="right">cell</td>
	</tr>
	<tr>
		<td class="left bottom">cell</td><td class="bottom">cell</td><td class="bottom right">cell</td>
	</tr>																	
</table>
	
		
 </body>
 </html>


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章