彻底搞懂JS无缝滚动代码


Posted in Javascript onJanuary 03, 2007

在做个东西要滚动代码 而且是无缝的 搞了半天还是不行 
决心一定要把这个问题搞定 经过研究 也不难 代码如下:

 程序代码 

<div id=demo style=overflow:auto;height:180;width:200;background:#009900;color:#006600>  
<table  align=top>  
<tr>  
<td id=demo1 valign=top>  <p>aaaaaaaaaaa</p>  
<p>aaaaaaaaaaa</p>  
<p>aaaaaaaaaaa</p>  
<p>aaaaaaaaaaa</p>  
<p>aaaaaaaaaaa</p>  
<p>aaaaaaaaaaa</p>  

 </td>  
</tr>  
<tr>  
<td id=demo2 valign=top></td>  
</tr>  
</table>  
</div>  
<script>  
var speed=15  
demo2.innerHTML=demo1.innerHTML//克隆demo1为demo2  
function Marquee(){  
if(demo2.offsetHeight-demo.scrollTop<=0)//当滚动至demo1与demo2交界时  
demo.scrollTop-=demo1.offsetHeight//demo跳到最顶端  
else{  
demo.scrollTop++  //如果是横向的 将 所有的 height top 改成 width left  
}  
}  
var MyMar=setInterval(Marquee,speed)//设置定时器  
demo.onmouseover=function() {clearInterval(MyMar)}//鼠标移上时清除定时器达到滚动停止的目的  
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}//鼠标移开时重设定时器  
</script> 

复制到一个HTM的文件即可运行了. 

Javascript 相关文章推荐
Js 获取当前日期时间及其它操作实现代码
Mar 04 Javascript
js 数组操作代码集锦
Apr 28 Javascript
一个XML格式数据转换为图表的例子
Feb 09 Javascript
关于UTF-8的客户端用AJAX方式获取GB2312的服务器端乱码问题的解决办法
Nov 30 Javascript
JavaScript学习笔记整理之引用类型
Jan 22 Javascript
基于jquery实现智能提示控件intellSeach.js
Mar 17 Javascript
Node.js开启Https的实践详解
Oct 25 Javascript
Vue2.0用 watch 观察 prop 变化(不触发)
Sep 08 Javascript
用jQuery将JavaScript对象转换为querystring查询字符串的方法
Nov 12 jQuery
JavaScript实现无限级递归树的示例代码
Mar 29 Javascript
Vue移动端右滑屏幕返回上一页附源码下载
Jun 26 Javascript
如何在postman测试用例中实现断言过程解析
Jul 09 Javascript
经典的解除许多网站无法复制文字的绝招
Dec 31 #Javascript
对象的类型:本地对象(1)
Dec 29 #Javascript
JavaScript高级程序设计
Dec 29 #Javascript
JavaScript 参考教程
Dec 29 #Javascript
js自带函数备忘 数组
Dec 29 #Javascript
slice函数的用法 之不错的应用
Dec 29 #Javascript
通过js脚本复制网页上的一个表格的不错实现方法
Dec 29 #Javascript
You might like
《PHP编程最快明白》第八讲:php启发和小结
2010/11/01 PHP
微信公众号开发之微信公共平台消息回复类实例
2014/11/14 PHP
smarty内置函数section的用法
2015/01/22 PHP
php基于PDO连接MSSQL示例DEMO
2016/07/13 PHP
深入解析PHP底层机制及相关原理
2020/12/11 PHP
javascript判断用户浏览器插件安装情况的代码
2011/01/01 Javascript
jQuery 选择器项目实例分析及实现代码
2012/12/28 Javascript
jQuery列表拖动排列具体实现
2013/11/04 Javascript
jquery教程ajax请求json数据示例
2014/01/13 Javascript
浅谈JavaScript实现面向对象中的类
2014/12/09 Javascript
Javascript优化技巧之短路表达式详细介绍
2015/03/27 Javascript
jQuery+PHP+MySQL实现无限级联下拉框效果
2016/02/19 Javascript
Nodejs进阶:基于express+multer的文件上传实例
2016/11/21 NodeJs
AngularJS实现controller控制器间共享数据的方法示例
2017/10/30 Javascript
python引用DLL文件的方法
2015/05/11 Python
Python在for循环中更改list值的方法【推荐】
2018/08/17 Python
pandas中的series数据类型详解
2019/07/06 Python
Python爬虫获取豆瓣电影并写入excel
2020/07/31 Python
python生成word合同的实例方法
2021/01/12 Python
全球独特生活方式产品和礼品购物网站:AHAlife
2018/09/18 全球购物
J2EE相关知识面试题
2013/08/26 面试题
英语翻译系毕业生求职信
2013/09/29 职场文书
留学自荐信的技巧
2013/10/17 职场文书
策划主管的工作职责
2013/11/24 职场文书
工厂保安员岗位职责
2014/01/31 职场文书
财务学生的职业生涯发展
2014/02/11 职场文书
倡议书格式
2014/04/14 职场文书
小学生爱国演讲稿
2014/04/25 职场文书
护理专业自荐书
2014/06/04 职场文书
农行心得体会
2014/09/02 职场文书
印刷技术专业自荐信
2014/09/18 职场文书
2015年八一建军节活动总结
2015/03/20 职场文书
2016年小学教师师德承诺书
2016/03/25 职场文书
MySql 8.0及对应驱动包匹配的注意点说明
2021/06/23 MySQL
Vue Mint UI mt-swipe的使用方式
2022/06/05 Vue.js
win10忘记pin密码登录不了怎么办?win10忘记pin密码登不进去的解决方法
2022/07/07 数码科技