<table>
<tr>
<td> <div id="marquees"> <!-- 这些是字幕的内容,你可以任意定义 --> <table width=500 >
<tr>
<td> <a href="#">早在年初本人就开始构思建立个人主页</a>
</td>
</tr>
<tr>
<td>
<a href="#">到今天为止,本站共上传了近200个页面。(9.1)</a>
</td>
</tr>
<tr>
<td>
<a href="#">FLASH选修课案例完工,DW选修课案例可望在10、1前搞定。(9、9) </a>
</td>
</tr>
</table> </div>
</td>
</tr>
</table> <!-- 以下是javascript代码 -->
<script language="javascript">
<!--
marqueesHeight=80; //内容区高度
stopscroll=false; //这个变量控制是否停止滚动
with(marquees){
noWrap=true; //这句表内容区不自动换行
style.width=0; //于是我们可以将它的宽度设为0,因为它会被撑大
style.height=marqueesHeight;
style.overflowY="hidden"; //滚动条不可见
onmouseover=new Function("stopscroll=true"); //鼠标经过,停止滚动
onmouseout=new Function("stopscroll=false"); //鼠标离开,开始滚动
}
//这时候,内容区的高度是无法读取了。下面输出一个不可见的层"templayer",稍后将内容复制到里面:
document.write('<div id="templayer" style="position:absolute;z-index:1;visibility:hidden"></div>');
function init(){ //初始化滚动内容
//多次复制原内容到"templayer",直到"templayer"的高度大于内容区高度:
while(templayer.offsetHeight<marqueesHeight){
templayer.innerHTML+=marquees.innerHTML;
}
//把"templayer"的内容的“两倍”复制回原内容区:
marquees.innerHTML=templayer.innerHTML+templayer.innerHTML;
//设置连续超时,调用"scrollUp()"函数驱动滚动条:
setInterval("scrollUp()",20);
}
document.body.onload=init;
preTop=0; //这个变量用于判断滚动条是否已经到了尽头
function scrollUp(){ //滚动条的驱动函数
if(stopscroll==true) return; //如果变量"stopscroll"为真,则停止滚动
preTop=marquees.scrollTop; //记录滚动前的滚动条位置
marquees.scrollTop+=1; //滚动条向下移动一个像素
//如果滚动条不动了,则向上滚动到和当前画面一样的位置
//当然不仅如此,同样还要向下滚动一个像素(+1):
if(preTop==marquees.scrollTop){
marquees.scrollTop=templayer.offsetHeight-marqueesHeight+1;
}
}
-->
</script>

Table上下滚动的更多相关文章

  1. Bootstrap Blazor 开源UI库介绍-Table 虚拟滚动行

    今天我们来介绍一下 Bootstrap Blazor 中 Table 组件的虚拟滚动行,什么是虚拟滚动呢,我查到的解释是:只渲染可视区域的列表项,非可见区域的 完全不渲染,在滚动条滚动时动态更新列表项 ...

  2. ul 仿 table 循环滚动

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. react中使用antd Table组件滚动加载数据的实现

    废话不多说,直接上代码.一目了然. import React, { Component } from "react"; import { Table } from "an ...

  4. IOS-tableView中的cellHeadView随着table滚动

    IOS-tableView中的cellHeadView随着table滚动 设置table的style 首先要将table设置为UITableViewStyleGrouped类型.这样就会得到table ...

  5. vue中获取滚动table的可视页面宽度,调整表头与列对齐(每列宽度不都相同)

    mounted() { // 在mounted中监听表格scroll事件 this.$refs.scrollTable.addEventListener( 'scroll',(event) => ...

  6. dede图片横向滚动

    <div id=demo style="overflow:hidden; width:960px;" > <table border=0 align=" ...

  7. tableView优化性能

    在iOS应用中,UITableView应该是使用率最高的视图之一了.iPod.时钟.日历.备忘录.Mail.天气.照片.电话.短信. Safari.App Store.iTunes.Game Cent ...

  8. uitableview性能优化(转)

    这个感觉写的很好 收藏一下 以备后用 转自 http://www.cnblogs.com/pengyingh/articles/2354714.html 在iOS应用中,UITableView应该是使 ...

  9. iOS-性能优化3

    iOS-性能优化3 UITableView性能优化与卡顿问题 1.最常用的就是cell的重用, 注册重用标识符 如果不重用cell时,每当一个cell显示到屏幕上时,就会重新创建一个新的cell 如果 ...

随机推荐

  1. snmp代码篇

    相关链接:Snmp学习笔记使用snmp4j实现Snmp功能(一)使用snmp4j实现Snmp功能(二)使用snmp4j实现Snmp功能(三) SNMP是英文“Simple Network Manage ...

  2. bzoj 3289 Mato的文件管理 树状数组+莫队

    Mato的文件管理 Time Limit: 40 Sec  Memory Limit: 128 MBSubmit: 4325  Solved: 1757[Submit][Status][Discuss ...

  3. bzoj 2599 [IOI2011]Race 点分

    [IOI2011]Race Time Limit: 70 Sec  Memory Limit: 128 MBSubmit: 4768  Solved: 1393[Submit][Status][Dis ...

  4. HDU1394 逆序数

    Minimum Inversion Number Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java ...

  5. [异常处理]class kafka.common.UnknownTopicOrPartitionException (kafka.server.ReplicaFetcherThread)

    在kafka.out日志里出现大量 ERROR [ReplicaFetcherThread-0-1], Error for partition [FLAG_DATA_SYC,1] to broker ...

  6. 旋转 3d

    建议chorme浏览器浏览,有样式兼容性问题. 图片可以根据自己本地路径设置路径,js库引用jquery. 写的不好,多多建议,谢谢大家. <html onselectstart="r ...

  7. MongoDB入门(6)- 我们自己封装的MongoDB-C#版本

    Wisdombud.Mongo 包含内容 MongoDB.Bson.dll MongoDB.Bson.xml MongoDB.Driver.dll MongoDB.Driver.xml Wisdomb ...

  8. 51Nod 1344 走格子 | 贪心

    Input示例 5 1 -2 -1 3 4 Output示例 2 贪心 #include <bits/stdc++.h> using namespace std; typedef long ...

  9. [Luogu 2073] 送花

    很容易想到的平衡树,加个维护区间和. 只需要插入和删除操作即可. kth其实都不用的,最小和最大可以从根节点log n一直向左/一直向右跑到叶子节点而求得. 记得每插入完一个点一定要更新区间和!!更新 ...

  10. 安装显卡后蓝屏0x00000116解决办法

    1. 亲自遇到蓝屏的问题. 2. 进入安全模式后重装系统,成功. 3. 安装驱动,软件没毛病.安装显卡驱动后,蓝屏. 4. 查看蓝屏错误代码0x00000116, 百度后查看到是显卡驱动的问题. 5. ...