Quantcast
Channel: IT社区推荐资讯 - ITIndex.net
Viewing all articles
Browse latest Browse all 15843

Table冻结表头

$
0
0

Table冻结表头:

<script type="text/javascript">
	function fixupFirstRow(tab) {   
    		var div=tab.parentNode;   
    		if(div.className.toLowerCase()=="freezediv"){   
	          tab.rows[0].style.zIndex="1";   
	          tab.rows[0].style.position="relative";   
	          div.onscroll = function(){   
	              var tr = tab.rows[0];   
	              tr.style.top = this.scrollTop-(this.scrollTop==0?1:2);   
	              tr.style.left=-1;   
	          } 
   			}   
  	} 

  	window.onload = function(){   
        var tab=document.getElementById("freezedivTable"); 
        if(tab){
           fixupFirstRow(tab);
        }   
    }   </script>


html源码:

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><script type="text/javascript">
			function fixupFirstRow(tab) {   
		    		var div=tab.parentNode;   
		    		if(div.className.toLowerCase()=="freezediv"){   
			          tab.rows[0].style.zIndex="1";   
			          tab.rows[0].style.position="relative";   
			          div.onscroll = function(){   
			              var tr = tab.rows[0];   
			              tr.style.top = this.scrollTop-(this.scrollTop==0?1:2);   
			              tr.style.left=-1;   
			          } 
		   			}   
		  	} 
		  	window.onload = function(){   
		        var tab=document.getElementById("freezedivTable"); 
		        if(tab){
		           fixupFirstRow(tab);
		        }   
		    }   </script></head><body><div class="freezediv" style="width:100%;height:100px;overflow:auto;"><table id="freezedivTable" style="width:100%;" border="1"><tr bgcolor="white"><th width="25%">序号</th><th width="25%">内容</th><th width="25%">序号</th><th width="25%">内容</th></tr><tr><td>1</td><td>内容</td><td>11</td><td>内容</td></tr><tr><td>2</td><td>内容</td><td>22</td><td>内容</td></tr><tr><td>3</td><td>内容</td><td>33</td><td>内容</td></tr><tr><td>4</td><td>内容</td><td>44</td><td>内容</td></tr><tr><td>5</td><td>内容</td><td>55</td><td>内容</td></tr><tr><td>6</td><td>内容</td><td>66</td><td>内容</td></tr><tr><td>7</td><td>内容</td><td>77</td><td>内容</td></tr><tr><td>8</td><td>内容</td><td>88</td><td>内容</td></tr><tr><td>9</td><td>内容</td><td>99</td><td>内容</td></tr><tr><td>10</td><td>内容</td><td>1010</td><td>内容</td></tr></table></div></body></html>


 


 

作者:zyuc_wangxw 发表于2013-8-20 17:32:14 原文链接
阅读:36 评论:0 查看评论

Viewing all articles
Browse latest Browse all 15843

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>