js 动态文字滚动的例子


Posted in Javascript onJanuary 17, 2011
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>这是一个动态JavaScript文字显示的例子</title> 
<script type="text/JavaScript"> 
var POSITION = 50; 
var DELAY = 150; 
var MESSAGE = "这是一个动态JavaScript文字显示的例子"; 
function bannerObject(){ 
this.msg = MESSAGE; 
this.out = " "; 
this.pos = POSITION; 
this.delay = DELAY; 
this.i = 0; 
this.reset = clearMessage; 
} 
  
function clearMessage(){ 
this.pos = POSITION; 
} 
var scroll = new bannerObject(); 
function scroller(){ 
scroll.out += " "; 
if(scroll.pos>0) 
for (scroll.i = 0; scroll.i < scroll.pos; scroll.i++){ 
scroll.out +=" " ; 
} 
if (scroll.pos>= 0) 
scroll.out += scroll.msg; 
else 
scroll.out = scroll.msg.substring(-scroll.pos,scroll.msg.length); 
document.noticeForm.notice.value = scroll.out; 
scroll.out = " "; 
scroll.pos--; 
scroll.pos--; 
if (scroll.pos < -(scroll.msg.length)) { 
scroll.reset(); 
} 
window.setTimeout("scroller()", scroll.delay); 
} 
</script> 
</head> 
<body onload="scroller()" bgcolor="#000000" link="#C0C0C0" vlink="#C0C0C0" alink="#008080" text="#C0C0C0"> 
<table border="0" cellspacing="0" cellpadding="0"> 
<tr><td width="100%"> 
<form name="noticeForm" action=""> 
<p><input type="text" name="notice" size="50" style="background-color: rgb(192,192,192)"/></p> 
</form> 
</td></tr> 
</table> 
</body> 
</html>

在状态栏滚动文字
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>这是一个跑马灯效果的JavaScript文档-在状态栏</title> 
<script type="text/JavaScript"> 
var msg = "这是一个跑马灯效果的JavaScript文档"; 
var interval = 100; 
var spacelen = 120; 
var space10 = " "; 
var seq = 0; 
function Scroll() { 
len = msg.length; 
window.status = msg.substring(0, seq + 1); 
seq++; 
if (seq >= len) { 
seq = spacelen; 
window.setTimeout("Scroll2();", interval); 
} 
else 
window.setTimeout("Scroll();", interval); 
} 
function Scroll2() { 
var out = ""; 
for (i = 1; i <= spacelen / space10.length; i++) 
out +=space10; 
out = out + msg; 
len = out.length; 
window.status = out.substring(seq, len); 
seq++; 
if (seq >= len) { seq = 0; }; 
window.setTimeout("Scroll2();", interval); 
} 
Scroll(); 
</script> 
</head> 
<body> 
</body> 
</html>
Javascript 相关文章推荐
jQuery学习笔记之Helloworld
Dec 22 Javascript
JS实现文字链接感应鼠标淡入淡出改变颜色的方法
Feb 26 Javascript
JavaScript函数参数使用带参数名的方式赋值传入的方法
Mar 19 Javascript
JS实现的表头列头固定页面功能示例
Jan 10 Javascript
Node.js连接mongodb实例代码
Jun 06 Javascript
js如何找出字符串中的最长回文串
Jun 04 Javascript
解决循环中setTimeout执行顺序的问题
Jun 20 Javascript
如何自动化部署项目?折腾服务器之旅~
Apr 16 Javascript
layui实现数据分页功能
Jul 27 Javascript
多个vue子路由文件自动化合并的方法
Sep 03 Javascript
vue 中url 链接左边的小图标更改问题
Dec 30 Javascript
vue实现水波涟漪效果的点击反馈指令
May 31 Vue.js
JavaScript中的Array对象使用说明
Jan 17 #Javascript
改进UCHOME的记录发布,增强可访问性用户体验
Jan 17 #Javascript
对xmlHttp对象的理解
Jan 17 #Javascript
对xmlHttp对象方法和属性的理解
Jan 17 #Javascript
Grid得到选择行数据的方法总结
Jan 17 #Javascript
JS中confirm,alert,prompt函数区别分析
Jan 17 #Javascript
JavaScript flash复制库类 Zero Clipboard
Jan 17 #Javascript
You might like
PHP生成HTML静态页面实例代码
2008/08/31 PHP
探讨file_get_contents与curl效率及稳定性的分析
2013/06/06 PHP
PHP+jquery实时显示网站在线人数的方法
2015/01/04 PHP
PHP中new static()与new self()的比较
2016/08/19 PHP
JavaScript中this关键字使用方法详解
2007/03/08 Javascript
070823更新的一个[消息提示框]组件 兼容ie7
2007/08/29 Javascript
国外的为初学者写的JavaScript教程
2008/06/09 Javascript
Mootools 1.2教程(2) DOM选择器
2009/09/14 Javascript
一个简单的jQuery插件制作 学习过程及实例
2010/04/25 Javascript
js 火狐下取本地路径实现思路
2013/04/02 Javascript
jquery 获取表单元素里面的值示例代码
2013/07/28 Javascript
jquery高级编程的最佳实践详解
2014/03/23 Javascript
javascript获取当前的时间戳的方法汇总
2015/07/26 Javascript
基于javascript实现简单计算器功能
2016/01/03 Javascript
JavaScript的Backbone.js框架环境搭建及Hellow world示例
2016/05/07 Javascript
如何获取元素的最终background-color
2017/02/06 Javascript
JavaScript中清空数组的三种方式
2017/03/22 Javascript
JS实现自动轮播图效果(自适应屏幕宽度+手机触屏滑动)
2017/06/19 Javascript
[原创]js实现保存文本框内容为本地文件兼容IE,chrome,火狐浏览器
2018/02/14 Javascript
基于AngularJs select绑定数字类型的问题
2018/10/08 Javascript
webpack+express实现文件精确缓存的示例代码
2020/06/11 Javascript
解决Nuxt使用axios跨域问题
2020/07/06 Javascript
Nuxt配置Element-UI按需引入的操作方法
2020/07/06 Javascript
python实现列表的排序方法分享
2019/07/01 Python
将labelme格式数据转化为标准的coco数据集格式方式
2020/02/17 Python
QT5 Designer 打不开的问题及解决方法
2020/08/20 Python
CSS3之背景尺寸Background-size使用介绍
2013/10/14 HTML / CSS
捷克家居装饰及图书音像购物网站:Velký košík
2018/04/16 全球购物
德国足球商店:OUTFITTER
2019/05/06 全球购物
Probikekit欧盟:在线公路自行车专家
2019/07/12 全球购物
高分子材料个人求职信范文
2013/09/25 职场文书
绩效考核实施方案
2014/03/18 职场文书
小学生作文评语大全
2014/04/21 职场文书
出纳工作检讨书
2014/10/18 职场文书
Django drf请求模块源码解析
2021/06/08 Python
《堡垒之夜》联动《刺客信条》 4月7日正式上线
2022/04/06 其他游戏