demojava
- 浏览: 548829 次
- 性别:
- 来自: 上海
-
文章分类
最新评论
-
coosummer：
推荐使用http://buttoncssgenerator.c ...
【转载】CSS圆角按钮（一） -
saiarmuluo：
不错，支持。
java log4j日志 写入数据库 -
springdata_springmvc：
spring mvc demo教程源代码下载，地址：http: ...
Freemarker 使用 -
zlbdexiaohao：
棒棒的
flex ToolTip汇总 -
hw_128：
demo的代码的，能不能发一下，谢谢 qq257515270 ...
java log4j日志 写入数据库
Html:如何固定表格的标题行和标题列
转载连接：
http://www.ninedns.com/html/20074221600272299.html
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<script>
function syncscroll(obj)
{
//y.innerHTML = obj.scrollTop;
//x.innerHTML = obj.scrollLeft;
scroll1.children[0].style.position = "relative";
scroll2.children[0].style.position = "relative";
scroll1.children[0].style.left = "-"+obj.scrollLeft;
scroll2.children[0].style.top = "-"+obj.scrollTop;
}
</script>
<body>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<!--*********左上-BEGIN***********-->
<table width="240" height="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#666666">
<colgroup>
<col width="80" >
<col width="80" >
<col width="80" >
</colgroup>
<tr bgcolor="#FFFFFF">
<td height="20">列1</td>
<td>列2</td>
<td>列3</td>
</tr>
</table>
<!--**************左上-END**********-->
</td>
<td>
<div id='scroll1' style="width:450;overflow:hidden ">
<!--***********右上-BEGIN********-->
<table style="width:900 " height="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#666666">
<colgroup>
<col width="150" >
<col width="150" >
<col width="150" >
<col width="150" >
<col width="150" >
</colgroup>
<tr bgcolor="#FFFFFF">
<td>列4</td>
<td height="20">列5</td>
<td>列6</td>
<td>列7</td>
<td>列8</td>
</tr>
</table>
<!--************右上-END**********-->
</div>
</td>
</tr>
<tr>
<td align="left" valign="top">
<div id='scroll2' style="height:150;overflow-y:hidden;overflow-x:scroll">
<!--*************左下-BEGIN**************-->
<table width="240" height="100%" border="0" cellpadding="0" cellspacing="1" bgcolor="#666666">
<colgroup>
<col width="80" >
<col width="80" >
<col width="80" >
</colgroup>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
</tr>
</table>
<!--*************左下-END***********-->
</div>
</td>
<td align="left" valign="top">
<div style="width:450;height:150;overflow:scroll " onscroll="javascript:syncscroll(this)">
<!--***********右下-BEGIN***********-->
<table style="width:900 " height="100" border="0" cellpadding="0" cellspacing="1" bgcolor="#666666">
<colgroup>
<col width="150" >
<col width="150" >
<col width="150" >
<col width="150" >
<col width="150" >
</colgroup>
<tr bgcolor="#FFFFFF">
<td width="100" height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFFFF">
<td height="20"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
<!--*************右下-END*****************-->
</div>
</td>
</tr>
</table>
<p id="y"> </p>
<p id="x"> </p>
</body>
</html>
转载连接：
http://www.ninedns.com/html/20074221600272299.html
分享到：
发表评论
-
Canvas 精度条 demo
2012-12-13 15:49 1126帮 问答 模块一哥们写demo 效果图如下： < ... -
javascrip Function
2012-02-04 11:48 1272javascript函数在javascirpt 1 ... -
一款非常不错的jquery window
2012-01-12 12:36 0jQuery Window Plugin htt ... -
ie打印接口带自动分页
2012-01-04 19:52 37842009-09-15 JavaScript IE打印接口带自动 ... -
javascript - scrollTop,offsetTop
2011-12-21 16:49 0<html> <head> ... -
转载html-IFream
2011-07-29 16:55 924本文为转载，非原创 ... -
javascript解析xml(IE,FF)
2011-03-11 20:07 2409IE写法： xmlDoc=new ActiveXObject ... -
javascript属性带特殊符号处理(#,.\)
2011-02-24 09:03 2410本文个人总结：转载请表明出处：http://demojava. ... -
javascript select 操作
2011-01-06 13:32 1100js操作select 1.判断select选项中 是否存 ... -
js时间验证
2011-01-04 09:35 1735// 验证输入的日期 //startdate_st ... -
CSS-background-position
2010-12-17 13:46 1495#edit_bar{ width:99%; margin:5 ... -
javascript打开页面方法
2010-10-18 10:19 2732判断是否在框架集中打开页面的if(location!=top. ... -
如何用js获取table第1行第2列的值
2010-10-11 10:17 3902<html><head > < ... -
IE6.0、IE7.0 与FireFox CSS兼容的解决方法
2010-08-25 14:33 1323IE6.0、IE7.0 与FireFox CSS兼容的解决方法 ... -
表单点击提交按钮后变成灰色不可再次点击
2010-08-20 16:20 4205<html> <head><m ... -
Yahoo!,Jquery,prototype与Ext适配器文件引入顺序
2010-08-18 18:09 1150ext的适配器文件引入顺序:Ext ext-base ... -
javascript常用的刷新页方法浅谈
2010-08-12 17:06 1110Javascript刷新页面的几种方法：1 histor ... -
js正则表达士
2010-07-29 21:36 984这是我发了不少时间整理的C#的正则表达式，新手朋友注意一定要手 ... -
JScript中正则表达式用法详解
2010-07-29 21:32 964首相讲讲JScript ... -
Javascript中最常用的经典技巧
2010-07-29 21:31 7851. oncontextmenu="window.e ...
相关推荐
"jquery 固定表格标题和列"就是解决这一问题的一个实用方案，它利用JavaScript库jQuery来实现表格的动态固定效果，确保在滚动时标题和列始终保持可见，提高了用户体验。 1. **jQuery**：jQuery是一个高效、简洁且...
标题中的“固定表格列标题”指的是在网页设计中，如何实现表格的表头（thead）在用户滚动页面时始终保持可见，以便用户在查看表格数据时始终能看清列名。这通常用于处理大型数据表，当表格内容过多，需要滚动浏览时...
在网页设计中，HTML表格（Table）是一种常用的数据展示方式，但当表格内容过多时，滚动查看会使得标题行消失，影响用户阅读。为解决这一问题，开发者通常采用JavaScript来实现Table标题行的固定，使其在滚动时始终...
在网页设计制作中，表格标题是网页内容组织和呈现的重要元素，它有...通过掌握HTML表格标题的语法和优化技巧，我们可以创建出更符合用户需求的网页。在实际操作中，结合示例和使用指南，可以更好地理解和应用这些知识。
总之，“jquery表格标题固定特效代码.zip”提供的是一种实用的jQuery解决方案，它使得网页表格在滚动时能保持标题的可见性，提高了数据的可读性和用户交互体验。通过理解和应用这些代码，开发者可以为他们的网页应用...
在网页设计中，数据展示通常会使用...通过以上方法，我们可以为网页中的表格提供更好的可读性和用户体验，使用户在浏览长表格时仍能轻松地查看列标题。这种方法尤其适用于数据密集型的应用场景，如数据分析或报表展示。
这个插件通过监听表格容器的滚动事件，动态调整表头和固定列的位置，使其相对于可视区域保持不变。它利用了CSS定位（position）属性，如`position: absolute`或`position: fixed`来实现元素的固定。对于复合表头，...
本文将详细介绍如何在ASP.NET中实现GridView的固定标题和固定列。 首先，让我们理解标题固定的基本原理。通常，我们可以通过CSS样式来实现这个效果。创建一个包含标题的独立表格或者div，并设置其定位为`position:...
2. **多标题**：表格可以有多个表头（thead）行，允许更复杂的数据分类和排序，提高了数据可读性。 3. **行内编辑**：用户可以直接在表格行内进行数据编辑，提升了用户体验和工作效率，尤其适用于数据录入和管理场景...
首先，创建一个包含表格的HTML结构，然后通过JavaScript获取到需要冻结的行或列，并设置CSS样式使其固定。例如，对于行，可以使用`position: fixed`和适当的`top`值；对于列，使用`position: fixed`和`left`值。 JS...
在描述中提到的“asp.net gridview 固定标题和列”，指的是如何在GridView中实现标题行和列在用户滚动时始终保持可见，这种效果通常被称为冻结列或冻结头。以下将详细讲解如何在ASP.NET中实现GridView的固定标题和列...
格式化表格可以使用属性检查器来增加行、列和边框，对表格或单元格插入背景图像等。 五、表单 表单是 HTML 文档中的一种重要结构元素，用于收集用户输入的数据。表单可以包含多种元素，例如文本框、密码框、单选框...
Bootstrap表格是前端开发中常用的工具，它为网页布局提供了强大的灵活性和一致性。在Bootstrap中，表格（Table）组件是用于展示结构化数据的一种方式。在某些情况下，我们可能需要对表格的列进行合并，以便更好地...
在网页设计中，固定表头和第一列是常见的需求，特别是在处理大数据量的表格时，为了保持用户在滚动查看数据时能始终看到列标题和行标识，这种布局方式显得尤为重要。"表头、第一列固定的表格"这个主题，通常涉及到...
通过这个标记可以直接添加表格的标题，而且可以控制标题文字的排列属性。 基本语法 … 语法解释 标记之间的就是标题的内容，这个标记使用在标记中. 文件范例：10—14.htm 通过标记设定表格的标题。01 <!– ——...
通过分析这个文件，我们可以了解如何将HTML表格与JavaScript结合起来，提升用户体验。 总结，"html+css+script 简单表格"主题涵盖了使用HTML创建表格结构，用CSS美化表格样式，以及用JavaScript增强表格功能的全...
jqGrid是基于jQuery的表格控件库，它提供了许多有用的属性和方法来操作HTML表格。下面是jqGrid表格属性大全的详细介绍： Table对象 Table对象是jqGrid中的一个基本对象，表示HTML文档中的表，对于文档中每个标记，...
这个效果对于提升用户体验非常重要，特别是在处理多列或者数据复杂度高的表格时，固定的表头可以让用户更容易理解数据的结构。 描述中的“整合了一个Gridview表头固定，里面有例子”表明，可能包含的压缩包文件中...
HTML5_html表头固定不滚动而内容滚动的效果，表格是基于Div CSS实现的，将表头固定住不滚动，而表格里面的每行数据随滚动条滚动。在显示较多数据时，当用户滚动鼠标中轮时，表格内容会滚动，而表头固定不变，可以将...
标题“左侧是表头的表格”暗示我们正在讨论一种特殊布局的表格，其中表头位于左侧，这在处理大量列数据时特别有用，因为它允许用户更容易地浏览和理解表格的内容。这种类型的表格常见于数据分析、报表展示以及各种...