<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. maven打包jar源码至私服

    1. setting文件 配置私服中设置的用户和密码 <servers> <server> <id>releases</id> <username ...

  2. ACE线程管理机制-并发控制(1)

    转载于:http://www.cnblogs.com/TianFang/archive/2006/12/04/581771.html ACE Lock类属 锁类属包含的类包装简单的锁定机制,比如互斥体 ...

  3. noip模拟赛 但有用

    题目描述 给定一个 n ∗ m 个矩阵,矩阵中每个数都是 [1, 12] 内的整数.你可以执行下列两个操作任意多次: • 指定一行,将该行所有数字 +1. • 指定一列,将该列所有数字 +1. 如果执 ...

  4. SCU 4527 NightMare2 最短路+二分 好题

    可怜的又做噩梦了..但是这次跟上次不大一样,虽然他又被困在迷宫里,又被装上了一个定时炸弹,但是值得高兴的是,他发现他身边有数不清的财宝,所以他如果能带着这些财宝并活着逃出去的话,他就发财啦.不过,这次 ...

  5. JAVA--未明确定义列

    原因:列明重复 可以加前缀或区别名以区分

  6. jQuery简单的Ajax调用

    index.php 的代码如下: <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"& ...

  7. Item 30 用enum代替int常量类型枚举,string常量类型枚举

    1.用枚举类型替代int枚举类型和string枚举类型 public class Show {   // Int枚举类型   // public static final int APPLE_FUJI ...

  8. 剖析 golang 的25个关键字

    剖析 golang 的25个关键字 基本在所有语言当中,关键字都是不允许用于自定义的,在Golang中有25个关键字,图示如下: 下面我们逐个解析这25个关键字. var && con ...

  9. LCA入门题集小结

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2586 题目: How far away ? Time Limit: 2000/1000 MS (Jav ...

  10. HDU 1114 Piggy-Bank (dp)

    题目链接 Problem Description Before ACM can do anything, a budget must be prepared and the necessary fin ...