<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script src="http://145.24.16.133:8080/monitor/charts/jquery.min.js"></script>
<script type="text/javascript">
$.fn.infiniteScrollUp=function(){
var self=this,kids=self.children()
kids.slice(20).hide();
setInterval(function(){
kids.filter(':hidden').eq(0).fadeIn();
kids.eq(0).fadeOut(function(){
$(this).appendTo(self)
kids=self.children();
});
},1000);
return this
}
$(function(){
$('tbody').infiniteScrollUp();
})
</script>
<title>infiniteScrollUp</title>
</head>
<body>
<table border="1" width="400">
<colgroup><col /><col /><col /><col /><col /><col /></colgroup>
<thead>
<tr><th>a</th><th>b</th><th>c</th><th>d</th><th>e</th><th>f</th></tr>
</thead>
<tbody>
<tr><td>1a</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1b</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1c</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1d</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1e</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1f</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1g</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1h</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1i</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1j</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1k</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1l</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1m</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1n</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1o</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1p</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1q</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1r</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1s</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1t</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1u</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1v</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1w</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1x</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1y</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
<tr><td>1z</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td></tr>
</tbody>
</table>
</body>
</html>
分享到：
相关推荐
`js`文件夹中的脚本可能是实现表格自动滚动和鼠标悬停暂停功能的关键。jQuery的`.animate()`方法可以用来创建平滑的滚动效果，通过设定时间间隔（如每隔一定毫秒）改变表格的 scrollTop 属性，从而达到信息自动向上...
本教程将深入探讨如何利用`jQuery`来创建一个表头固定、内容区域可滚动的表格。 首先，我们需要在HTML中构建基本的表格结构。表头`<thead>`通常包含表的列名，而表体`<tbody>`则包含实际的数据行。例如： ```html ...
自动滚屏（HTML经典用例） 自动滚屏是一种常见的...自动滚屏是一个非常有用的网页效果，可以通过使用JavaScript脚本语言来实现。它的优点是速度快，制作简单。可以通过修改相关的参数来控制滚动的速度和页面的长度。
本压缩包“HTML带滚动条的自动根据窗口宽度缩放的表格.zip”包含了一个实现特定功能的示例，即当浏览器窗口大小改变时，表格能够自动调整列宽并显示滚动条，以保持良好的可读性和用户体验。 这个示例可能涉及以下几...
综上所述，jQuery ScrollPagination插件通过监听滚动事件，实现在用户滚动到底部时自动加载更多数据，极大地提升了用户体验。通过合理配置和定制，你可以轻松地将其应用于自己的项目中，无论数据源来自哪里，只要能...
以下是一个基本的jQuery脚本，用于实现这一功能： ```javascript $(document).ready(function() { // 当点击表格单元格时，将其变为可编辑 $('#editableTable td').on('click', function() { $(this)....
而“ydrecode.sql”可能是一个SQL脚本文件，用于创建或修改数据库表，同样，虽然它可能涉及表格数据，但不直接涉及滚动条的实现。 综上所述，关于“TABLE滚动条”的知识点主要涵盖HTML表格、CSS样式（特别是CSS3...
本篇文章将详细讲解如何利用jQuery实现一个自动滚动表格并实现高亮显示的特效。 首先，我们需要理解jQuery的核心概念。jQuery通过提供简洁的API，使得开发者能够更高效地操作DOM（Document Object Model），比如...
例如，在Web应用程序中，如果有一个包含大量列的报表，使用横向滚动可以避免列的截断，同时保持页面布局的整洁。同样，对于纵向内容较多的列表或文章，纵向自动扩展可以确保用户能够看到所有内容，而无需固定页面的...
本文将详细介绍如何在JSP（JavaServer Pages）中实现一个带有滚动条的table表格，通过实例代码来帮助理解这一功能。 首先，让我们了解基本的HTML表格结构。在HTML中，`<table>`元素用于创建表格，而`<tr>`定义表格...
本文将深入探讨如何使用JavaScript来实现一个流畅的自动滚动表。 首先，理解“可滚动”（scrollable）的含义至关重要。在Web开发中，这意味着元素的内容超出了其可视区域，用户可以通过滚动条或手势查看隐藏的部分...
DataTables 是一个流行的开源JavaScript库，用于增强HTML表格的功能，尤其在Web应用中。它提供了一系列强大的功能，如排序、过滤、分页以及对大量数据的处理，使网页上的表格更加交互式和用户友好。 **描述分析：**...
在本项目中，jq轮播被用来创建一个可以自动或手动切换的图表展示区域，使用户能够在不同的图表之间平滑过渡。 接下来，我们要讨论ECharts。ECharts是一款由百度开源的，基于JavaScript的数据可视化库，它支持丰富的...
本文所介绍的JavaScript封装自动创建表格的实现代码，是一套用于动态生成HTML表格，并允许用户进行基本交互如添加、删除行以及编辑单元格的脚本。这种实现可以广泛应用于需要动态数据显示和管理的Web应用程序中。 #...
在提供的压缩包文件“Maintain GridView Scroll Position and Header Inside Update Panel”中，可能包含了实现这一功能的完整示例代码，包括ASP.NET后台代码、前端HTML和CSS，以及必要的JavaScript脚本。...
jQuery是一个广泛使用的JavaScript库，它简化了HTML文档遍历、事件处理、动画和Ajax交互。`RWD Table`插件利用jQuery的强大功能，实现了对表格的动态操作。通过调用jQuery方法，开发者可以方便地在页面加载后初始化...
在提供的压缩包文件中，可能包含了一个演示如何实现列隐藏和滚动条动态加载的示例项目。这个项目可能包括HTML文件、JavaScript文件（可能包含ExtJS库和自定义脚本），以及可能的CSS文件，用于定义样式。通过运行这...
只需简单地引入JS文件，就可以让表格自动适应页面的滚动行为，这大大简化了开发者的工作流程。通过在HTML中添加`<script>`标签引用`ScrollableTable.js`，开发者可以轻松地使表格具备滚动功能，使得用户能够方便地...
控件的核心是一个HTML表格（），其中包含一个行（）用于动态加载新闻条目。 在Page_Load事件处理程序中，我们执行SQL查询来获取新闻主表中的所有记录，按创建日期升序排列。然后，我们使用标签创建一个向上滚动的...
通过以上步骤，我们成功地创建了一个固定高度的`<div>`，并且当内容超出这个高度时，滚动条会自动出现。这种方法适用于那些需要限制显示区域但又不希望丢失任何内容的场景，例如，基本信息展示、评论区或者数据列表...