彻底搞懂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 相关文章推荐
从父页面读取和操作iframe中内容方法
Jul 25 Javascript
jQuery 使用手册(四)
Sep 23 Javascript
让div层随鼠标移动的实现代码 ie ff
Dec 18 Javascript
jquery实现商品拖动选择效果代码(自写)
May 28 Javascript
ajax与302响应代码测试
Oct 23 Javascript
原生js实现淘宝首页点击按钮缓慢回到顶部效果
Apr 06 Javascript
简单的jquery左侧导航栏和页面选中效果
Aug 21 Javascript
5个书写JavaScript代码的坏习惯,看看你中枪了没?
Nov 06 Javascript
jQuery Html控件基本操作(日常收集整理)
Mar 11 Javascript
JS 根据子网掩码,网关计算出所有IP地址范围示例
Apr 23 Javascript
jquery实现加载更多&quot;转圈圈&quot;效果(示例代码)
Nov 09 jQuery
js实现缓动动画
Nov 25 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错误、异常处理机制(补充)
2012/05/07 PHP
php单例模式的简单实现方法
2016/06/10 PHP
三个思路解决laravel上传文件报错:413 Request Entity Too Large问题
2017/11/13 PHP
PHP开发实现快递查询功能详解
2019/04/08 PHP
Jquery ajaxStart()与ajaxStop()方法(实例讲解)
2013/12/18 Javascript
javascript事件冒泡详解和捕获、阻止方法
2014/04/12 Javascript
javascript创建含数字字母的随机字符串方法总结
2016/08/01 Javascript
AngularJS基础 ng-srcset 指令简单示例
2016/08/03 Javascript
探究Vue.js 2.0新增的虚拟DOM
2016/10/20 Javascript
深入理解jQuery.data() 的实现方式
2016/11/30 Javascript
基于jQuery实现火焰灯效果导航菜单
2017/01/04 Javascript
使用vue.js2.0 + ElementUI开发后台管理系统详细教程(二)
2017/01/21 Javascript
微信小程序三级联动选择器使用方法
2020/05/19 Javascript
如何利用@angular/cli V6.0直接开发PWA应用详解
2018/05/06 Javascript
实例详解Vue项目使用eslint + prettier规范代码风格
2018/08/20 Javascript
在vue项目中引入highcharts图表的方法
2019/01/21 Javascript
JavaScript中filter的用法实例分析
2019/02/27 Javascript
vue实现路由不变的情况下,刷新页面操作示例
2020/02/02 Javascript
Python运算符重载用法实例
2015/05/28 Python
全面了解Python环境配置及项目建立
2016/06/30 Python
cmd运行python文件时对结果进行保存的方法
2018/05/16 Python
python smtplib模块自动收发邮件功能(二)
2018/05/22 Python
Python爬虫的两套解析方法和四种爬虫实现过程
2018/07/20 Python
使用Python的Turtle绘制哆啦A梦实例
2019/11/21 Python
在OpenCV里使用Camshift算法的实现
2019/11/22 Python
Python @property及getter setter原理详解
2020/03/31 Python
Python连接mysql数据库及简单增删改查操作示例代码
2020/08/03 Python
HTML5 播放 RTSP 视频的实例代码
2019/07/29 HTML / CSS
金融专业应届生求职信
2013/11/02 职场文书
大专生自我鉴定怎么写
2014/09/16 职场文书
城管执法人员个人对照检查材料思想汇报
2014/09/29 职场文书
法务专员岗位职责
2015/02/14 职场文书
2015年度个人思想工作总结
2015/04/08 职场文书
执行力心得体会范文
2016/01/11 职场文书
Vue OpenLayer测距功能的实现
2022/04/20 Vue.js
windows server 2012安装FTP并配置被动模式指定开放端口
2022/06/10 Servers