登陆

Html中 类似Excel窗口冻结的功能

 

  1. <style type="text/css"> 
  2. <!--  
  3. .fixTop {  
  4.     Z-Index:102;  
  5.     position:relative;  
  6.     Top:expression(this.offsetParent.scrollTop);  
  7. }  
  8.  
  9. .fixLeft {  
  10.     Z-Index:101;  
  11.     position:relative;  
  12.     left:expression(document.getElementById('scrollDiv').scrollLeft);  
  13.     background-color:#eeeeee;  
  14. }  
  15. --> 
  16. </style> 
  17.  
  18. 仅适用于IE:  
  19. <div id="scrollDiv" style="height: 200px; width:400px; overflow: auto;"> 
  20. <table border=1 cellspacing="0" cellpadding="2"> 
  21.     <tr class="fixTop" bgcolor="#eeeeee"> 
  22.         <th class="fixLeft"> 
  23.             LeftTop  
  24.         </th> 
  25.         <th colspan="9" align=left> 
  26.             Top  
  27.         </th> 
  28.     </tr>      
  29.    <tr height="50"> 
  30.        <td  class="fixLeft">Left</td> 
  31.        <td>abcdefg</td> 
  32.        <td>abcdefg</td> 
  33.        <td>abcdefg</td> 
  34.        <td>abcdefg</td> 
  35.        <td>abcdefg</td> 
  36.        <td>abcdefg</td> 
  37.        <td>abcdefg</td> 
  38.        <td>abcdefg</td> 
  39.        <td>abcdefg</td> 
  40.    </tr> 
  41.    <tr height="50"> 
  42.        <td  class="fixLeft">Left</td> 
  43.        <td>abcdefg</td> 
  44.        <td>abcdefg</td> 
  45.        <td>abcdefg</td> 
  46.        <td>abcdefg</td> 
  47.        <td>abcdefg</td> 
  48.        <td>abcdefg</td> 
  49.        <td>abcdefg</td> 
  50.        <td>abcdefg</td> 
  51.        <td>abcdefg</td> 
  52.    </tr> 
  53.  
  54.    <tr height="50"> 
  55.        <td  class="fixLeft">Left</td> 
  56.        <td>abcdefg</td> 
  57.        <td>abcdefg</td> 
  58.        <td>abcdefg</td> 
  59.        <td>abcdefg</td> 
  60.        <td>abcdefg</td> 
  61.        <td>abcdefg</td> 
  62.        <td>abcdefg</td> 
  63.        <td>abcdefg</td> 
  64.        <td>abcdefg</td> 
  65.    </tr> 
  66.  
  67.    <tr> 
  68.        <td  class="fixLeft">Left</td> 
  69.        <td>abcdefg</td> 
  70.        <td>abcdefg</td> 
  71.        <td>abcdefg</td> 
  72.        <td>abcdefg</td> 
  73.        <td>abcdefg</td> 
  74.        <td>abcdefg</td> 
  75.        <td>abcdefg</td> 
  76.        <td>abcdefg</td> 
  77.        <td>abcdefg</td> 
  78.    </tr> 
  79.  
  80.    <tr> 
  81.        <td  class="fixLeft">Left</td> 
  82.        <td>abcdefg</td> 
  83.        <td>abcdefg</td> 
  84.        <td>abcdefg</td> 
  85.        <td>abcdefg</td> 
  86.        <td>abcdefg</td> 
  87.        <td>abcdefg</td> 
  88.        <td>abcdefg</td> 
  89.        <td>abcdefg</td> 
  90.        <td>abcdefg</td> 
  91.    </tr> 
  92.  
  93.    <tr> 
  94.        <td  class="fixLeft">Left</td> 
  95.        <td>abcdefg</td> 
  96.        <td>abcdefg</td> 
  97.        <td>abcdefg</td> 
  98.        <td>abcdefg</td> 
  99.        <td>abcdefg</td> 
  100.        <td>abcdefg</td> 
  101.        <td>abcdefg</td> 
  102.        <td>abcdefg</td> 
  103.        <td>abcdefg</td> 
  104.    </tr> 
  105.  
  106. </table> 
  107. </div> 

 

« 上一篇 | 下一篇 »