zoukankan      html  css  js  c++  java
  • 利用jQuery创建一个表头固定的简单HTML表格。在滚动条向下滚动时,表头不变化。

    利用jQuery创建一个表头固定的简单HTML表格。在滚动条向下滚动时,表头不变化。

    <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="jquery-ui-1.7.2.custom.min.js"></script>
    <script type="text/javascript" src="jquery.chromatable.js"></script>
    <script>

        $(document).ready(function () {

            $("#yourTableID2").chromatable({

                "900px", // specify 100%, auto, or a fixed pixel amount
                height: "400px",
                scrolling: "yes" // must have the jquery-1.3.2.min.js script installed to use

            });
        });
    </script>

    <table id="yourTableID2" width="100%" border="0" cellspacing="0" cellpadding="0">
    <thead>
     <tr>
      <th>Check out this header</th>
      <th>Look here's another one</th>
      <th>Wow, look at me!</th>
     </tr>
    </thead>
    <tbody> 
     <tr>
      <td>Some content goes in here</td>
      <td>Praesent vitae ligula nec orci pretium vestibulum</td>
      <td>Maecenas tempus dictum libero</td>
     </tr>
     <tr>
      <td>Quisque in wisi quis orci tincidunt fermentum</td>
      <td>Mauris aliquet mattis metus</td>
      <td>Etiam eu ante non leo egestas nonummy</td>
     </tr>
     <tr>
      <td>Some content goes in here</td>
      <td>Praesent vitae ligula nec orci pretium vestibulum</td>
      <td>Maecenas tempus dictum libero</td>
     </tr>
     <tr>
      <td>Quisque in wisi quis orci tincidunt fermentum</td>
      <td>Mauris aliquet mattis metus</td>
      <td>Etiam eu ante non leo egestas nonummy</td>
     </tr>
    </tbody> 
    </table>

  • 相关阅读:
    左眼右眼
    Mac 的“任务管理器” —— 活动监视器
    [分享] VIM 常用命令及游戏练级
    iOS 7 如何关闭已打开的应用(App)
    iPhone 如何设置彩信 ?
    JavaScript —— attachEvent 方法的使用
    习惯&感恩
    MySQL 基础 备份和恢复
    Python 数据结构 树
    Python 正在表达式
  • 原文地址:https://www.cnblogs.com/TNSSTAR/p/2409223.html
Copyright © 2011-2022 走看看