彻底搞懂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 相关文章推荐
Javascript 篱式条件判断
Aug 22 Javascript
关闭ie窗口清除Session的解决方法
Jan 10 Javascript
利用js正则表达式验证手机号,email地址,邮政编码
Jan 23 Javascript
Jquery节点遍历next与nextAll方法使用示例
Jul 22 Javascript
Firefox下无法正常显示年份的解决方法
Sep 04 Javascript
javascript引用类型指针的工作方式
Apr 13 Javascript
深入理解JavaScript中的箭头函数
Jul 28 Javascript
纯HTML5制作围住神经猫游戏-附源码下载
Aug 23 Javascript
分享10个优化代码的CSS和JavaScript工具
May 11 Javascript
jQuery实现移动端手机商城购物车功能
Sep 24 Javascript
angular 基于ng-messages的表单验证实例
May 04 Javascript
vue中slot(插槽)的介绍与使用
Nov 12 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代码
2008/04/07 PHP
关于PHPDocument 代码注释规范的总结
2013/06/25 PHP
PHP中定义数组常量(array常量)的方法
2014/11/17 PHP
php导出中文内容excel文件类实例
2015/07/06 PHP
php实现按天数、星期、月份查询的搜索框
2016/05/02 PHP
php获取指定数量随机字符串的方法
2017/02/06 PHP
Extjs入门之动态加载树代码
2010/04/09 Javascript
基于jQuery的js分页代码
2010/06/10 Javascript
IE8 chrome中table隔行换色解决办法
2010/07/09 Javascript
JQuery each()函数如何优化循环DOM结构的性能
2012/12/10 Javascript
浅析document.createDocumentFragment()与js效率
2013/07/08 Javascript
javascript实现简单查找与替换的方法
2015/07/22 Javascript
JavaScript截取指定长度字符串点击可以展开全部代码
2015/12/04 Javascript
AngularJS入门(用ng-repeat指令实现循环输出
2016/05/05 Javascript
微信小程序 数据绑定详解及实例
2016/10/25 Javascript
javascript基本数据类型及类型检测常用方法小结
2016/12/14 Javascript
angularjs实现天气预报功能
2020/06/16 Javascript
实例详解Vue项目使用eslint + prettier规范代码风格
2018/08/20 Javascript
JavaScript变量提升和严格模式实例分析
2019/01/27 Javascript
小程序点击图片实现png转jpg
2019/10/22 Javascript
JavaScript代码异常监控实现过程详解
2020/02/17 Javascript
js动态生成表格(节点操作)
2021/01/12 Javascript
Python打包文件夹的方法小结(zip,tar,tar.gz等)
2016/09/18 Python
pandas去除重复列的实现方法
2019/01/29 Python
Python3网络爬虫开发实战之极验滑动验证码的识别
2019/08/02 Python
Python3操作读写CSV文件使用包过程解析
2020/04/10 Python
Python 3.9的到来到底是意味着什么
2020/10/14 Python
html5写一个BUI折叠菜单插件的实现方法
2019/09/11 HTML / CSS
新奇的小玩意:IWOOT
2016/07/21 全球购物
美国在线和移动免费会员制批发零售商:Boxed(移动端的Costco)
2020/01/02 全球购物
十八大闭幕感言
2014/01/22 职场文书
《雪地里的小画家》教学反思
2014/02/22 职场文书
《登鹳雀楼》教学反思
2014/04/09 职场文书
活动总结报告格式
2014/05/09 职场文书
给学校的建议书范文
2014/05/15 职场文书
2015年大学迎新工作总结
2015/07/16 职场文书