网页编程网
www.youkud.com
掌握计算机、网络技术，让生活更美好！
主页
网页制作
html5
JavaScript
DIV+CSS
前端美工
网络编程
Java与JSP
PHP
Python 3
Golang
R语言
数据库
Mysql
Oracle
NoSQL
SQLite
运维
Linux
正则表达式
架构
网页特效
移动开发
网络
SDN
QUIC
网络原理
人工智能
强化学习
机器学习
区块链
区块链1
区块2
dapp
理论
dapp案例
数据采集
爬虫技术
爬虫案例
当前位置：
主页
>>
网页特效
>> 正文
表格内信息向上滚动代码，类似航班
阅读：5749 输入：2017-06-02 16:31:35
<html> <head> <title>滚动信息</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <style type="text/css"> body{font-size:12px;background-color:#FFF;overflow:hidden;} td{font-size:12px;} .titletd td{background-color:#EFEFEF;padding:2px;text-align:center;} .datatd td{background-color:#FFFFFF;height:18px;padding-left:2px;} .td1{width:80px;} .td2{width:85px;} .td3{width:100px;} .td4{width:70px;} .td5{width:60px;} .td6{width:85px;} .td7{width:62px;} </style></head> <body> <table border="0" width="100%" cellspacing="0" cellpadding="0"> <tr> <td width="100%"> <table width="550" border="0" cellpadding="0" cellspacing="1" bgcolor="#cccccc"> <tr class="titletd"> <td nowrap class="td1">产品名称</td> <td nowrap class="td2">规格</td> <td nowrap class="td3">产地</td> <td nowrap class="td4">价格</td> <td nowrap class="td5">单位</td> <td nowrap class="td6">企业名称</td> <td nowrap class="td7">日期</td> </tr> </table> </td> </tr> <tr> <td width="100%"> <div id="A1"> <div id="A2"> <table width="550" border="0" cellpadding="0" cellspacing="1" bgcolor="#cccccc" style="margin-top:-1px;"> <tbody class="datatd"> <tr> <td nowrap class="td1">白银</td> <td nowrap class="td2">1#</td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">3,465</td> <td nowrap class="td5">元/公斤</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">锑</td> <td nowrap class="td2">1#</td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">47,000</td> <td nowrap class="td5">元/公斤</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">电解锰</td> <td nowrap class="td2">1#</td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">12,700</td> <td nowrap class="td5">元/吨</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">铜升水</td> <td nowrap class="td2">1#</td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">600</td> <td nowrap class="td5">元/吨</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">铜升水</td> <td nowrap class="td2">1#</td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">300</td> <td nowrap class="td5">元/吨</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">电解铜</td> <td nowrap class="td2">1#</td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">68,490</td> <td nowrap class="td5">元/吨</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">电解铝</td> <td nowrap class="td2">A00</td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">19,540</td> <td nowrap class="td5">元/吨</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">电解铅</td> <td nowrap class="td2">1#</td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">12,000</td> <td nowrap class="td5">元/吨</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">电解锌</td> <td nowrap class="td2">0#</td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">29,650</td> <td nowrap class="td5">元/吨</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">电解锌</td> <td nowrap class="td2">1#</td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">27,900</td> <td nowrap class="td5">元/吨</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">无氧铜丝</td> <td nowrap class="td2">Φ3mm</td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">69,400</td> <td nowrap class="td5">元/吨</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">镍</td> <td nowrap class="td2">1#</td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">315,000</td> <td nowrap class="td5">元/吨</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">锡</td> <td nowrap class="td2">1#</td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">78,000</td> <td nowrap class="td5">元/吨</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">钴</td> <td nowrap class="td2">1#</td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">400,000</td> <td nowrap class="td5">元/吨</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">漆包线</td> <td nowrap class="td2">0.1-2.5mm</td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">75,540</td> <td nowrap class="td5">元/吨</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">MB超细镍粉</td> <td nowrap class="td2">150～1000</td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">550</td> <td nowrap class="td5">元/公斤</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">砷铜合金</td> <td nowrap class="td2"> </td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">68,500</td> <td nowrap class="td5">元/吨</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-25</td> </tr> <tr> <td nowrap class="td1">砷铜合金</td> <td nowrap class="td2"> </td> <td nowrap class="td3">#</td> <td nowrap class="td4" align="right">68,500</td> <td nowrap class="td5">元/吨</td> <td nowrap class="td6">长江现货</td> <td nowrap class="td7">2018-8-24</td> </tr> </tbody> </table> </div> </div> </td> </tr> </table> <br> <table border="0" width="100%" cellspacing="0" cellpadding="0"> <tr> <td width="100%"> <table width="160" border="0" cellpadding="0" cellspacing="1" bgcolor="#cccccc"> <tr class="titletd"> <td nowrap class="td1">名称1</td> <td nowrap class="td1">名称2</td> </tr> </table> </td> </tr> <tr> <td width="100%"> <div id="B1"> <div id="B2"> <table width="160" border="0" cellpadding="0" cellspacing="1" bgcolor="#cccccc" style="margin-top:-1px;"> <tbody class="datatd"> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> <tr> <td nowrap class="td1">1234567890</td><td nowrap class="td1">1234567890</td> </tr> </tbody> </table> </div> </div> </td> </tr> </table> <SCRIPT> <!-- function _InitScroll(_S1,_S2,_W,_H,_T){ return "var marqueesHeight"+_S1+"="+_H+";var stopscroll"+_S1+"=false;var scrollElem"+_S1+"=document.getElementById('"+_S1+"');with(scrollElem"+_S1+"){style.width="+_W+";style.height=marqueesHeight"+_S1+";style.overflow='hidden';noWrap=true;}scrollElem"+_S1+".onmouseover=new Function('stopscroll"+_S1+"=true');scrollElem"+_S1+".onmouseout=new Function('stopscroll"+_S1+"=false');var preTop"+_S1+"=0; var currentTop"+_S1+"=0; var stoptime"+_S1+"=0;var leftElem"+_S2+"=document.getElementById('"+_S2+"');scrollElem"+_S1+".appendChild(leftElem"+_S2+".cloneNode(true));setTimeout('init_srolltext"+_S1+"()',"+_T+");function init_srolltext"+_S1+"(){scrollElem"+_S1+".scrollTop=0;setInterval('scrollUp"+_S1+"()',50);}function scrollUp"+_S1+"(){if(stopscroll"+_S1+"){return;}currentTop"+_S1+"+=1;if(currentTop"+_S1+"==(marqueesHeight"+_S1+"+1)) {stoptime"+_S1+"+=1;currentTop"+_S1+"-=1;if(stoptime"+_S1+"=="+_T/50+") {currentTop"+_S1+"=0;stoptime"+_S1+"=0;}}else{preTop"+_S1+"=scrollElem"+_S1+".scrollTop;scrollElem"+_S1+".scrollTop +=1;if(preTop"+_S1+"==scrollElem"+_S1+".scrollTop){scrollElem"+_S1+".scrollTop=0;scrollElem"+_S1+".scrollTop +=1;}}}"; } eval(_InitScroll("A1","A2",550,19*6,4000)); eval(_InitScroll("B1","B2",164,19*4,2000)); /* A1,A2或B1,B2是滚动内容区域外的两个DIV的ID 如<div id="B1"> <div id="B2"> _W为滚动内容的宽度 _H为滚动内容的高度,必须为单元格高度的整数倍，这里每个单元格是19px高 _T为滚动后每次停留言时间 */ //--> </SCRIPT> <pre style="color:green;"> /* 简单要说明： A1,A2或B1,B2是滚动内容区域外的两个DIV的ID _W为滚动内容的宽度 _H为滚动内容的高度,必须为单元格高度的整数倍，这里每个单元格是19px高 _T为滚动后每次停留言时间 */ </pre> </body> </html>
上一篇：
年份select选择框的无限扩展
下一篇：
用JavaScript计算二次函数的根值
相关阅读
纯js两组文字定时向上滚动特效
2018年最新版文字滚动特效（兼容多浏览器）
js实现图片连续无缝滚动
下载专区
软件下载（提取码：mtag）
Tag
网站Tag
标签云
HTML工具
进制间转换
进制转换（带小数）
html代码运行
HTML工具
字母翻转
硬盘整数分区
html颜色代码
HTML工具
除空格回车
万年历
fojiao
HTML工具
小游戏
在线绘画
更多
手机版
联系微信:jingqishens