JS实现状态栏跑马灯文字效果代码


Posted in Javascript onOctober 24, 2015

本文实例讲述了JS实现状态栏跑马灯文字效果代码。分享给大家供大家参考,具体如下:

这款状态栏跑马灯,文字跑动的定义在数组内,自己可修改内容。现在的IE8貌似不兼容,有缺憾的代码,欢迎JS爱好者修正,修正请发回一份。状态栏为效果显示区。

运行效果截图如下:

JS实现状态栏跑马灯文字效果代码

在线演示地址如下:

具体代码如下:

<HTML>
<HEAD>
<TITLE>间隔状态栏跑马灯</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<SCRIPT language=JavaScript>
<!--
function scrollit(seed) {
var m1 = "HI:你 好! ";
var m2 = "欢迎访问三水点靠木网站";
var m3 = "请 多 提 意 见,谢 谢!";
var m4 = "E-MAIL:";
var m5 = "/";
var msg=m1+m2+m3+m4+m5;
var out = " ";
var c = 1;
if (seed > 100) {
seed--;
cmd="scrollit("+seed+")";
timerTwo=window.setTimeout(cmd,100);
}
else if (seed <= 100 && seed > 0) {
for (c=0 ; c < seed ; c++) {
out+=" ";
}
out+=msg;
seed--;
window.status=out;
cmd="scrollit("+seed+")";
timerTwo=window.setTimeout(cmd,100);
}
else if (seed <= 0) {
if (-seed < msg.length) {
out+=msg.substring(-seed,msg.length);
seed--;
window.status=out;
cmd="scrollit("+seed+")";
timerTwo=window.setTimeout(cmd,100);
}
else {
window.status=" ";
timerTwo=window.setTimeout("scrollit(100)",75);
}
}
}
//-->
</SCRIPT>
<META content="MSHTML 6.00.2900.2963" name=GENERATOR>
</HEAD>
<BODY bgColor=#fef4d9 onload=scrollit(100)>
</BODY>
</HTML>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript KeyDown、KeyPress和KeyUp事件的区别与联系
Dec 03 Javascript
js 函数调用模式小结
Dec 26 Javascript
javascript firefox 自动加载iframe 自动调整高宽示例
Aug 27 Javascript
回车直接实现点击某按钮的效果即触发单击事件
Feb 27 Javascript
js继承call()和apply()方法总结
Dec 08 Javascript
详解jQuery中的元素的属性和相关操作
Aug 14 Javascript
Jquery基础之事件操作详解
Jun 14 Javascript
react-router实现跳转传值的方法示例
May 27 Javascript
VUE + UEditor 单图片跨域上传功能的实现方法
Feb 08 Javascript
webpack项目轻松混用css module的方法
Jun 12 Javascript
详解angular2.x创建项目入门指令
Oct 11 Javascript
微信小程序实现简单的select下拉框
Nov 23 Javascript
JavaScript实现标题栏文字轮播效果代码
Oct 24 #Javascript
JS实现IE状态栏文字缩放效果代码
Oct 24 #Javascript
jQuery实现悬浮在右上角的网页客服效果代码
Oct 24 #Javascript
jQuery+AJAX实现遮罩层登录验证界面(附源码)
Sep 13 #Javascript
JS实现从顶部下拉显示的带动画QQ客服特效代码
Oct 24 #Javascript
js获取表格的行数和列数的方法
Oct 23 #Javascript
js行号显示的文本框实现效果(兼容多种浏览器 )
Oct 23 #Javascript
You might like
用PHP编程开发“虚拟域名”系统
2006/10/09 PHP
PHP实现一个轻量级容器的方法
2019/01/28 PHP
TP5框架model常见操作示例小结【增删改查、聚合、时间戳、软删除等】
2020/04/05 PHP
php swoft框架实例用法
2020/12/22 PHP
Jquery index()方法 获取相应元素索引值
2012/10/12 Javascript
js操作iframe兼容各种主流浏览器示例代码
2013/07/22 Javascript
IE下JS保存图片的简单实例
2016/07/15 Javascript
xtemplate node.js 的使用方法实例解析
2016/08/22 Javascript
Bootstrap源码解读标签、徽章、缩略图和警示框(8)
2016/12/26 Javascript
JavaScript 数据类型详解
2017/03/13 Javascript
Vuejs入门教程之Vue生命周期,数据,手动挂载,指令,过滤器
2017/04/19 Javascript
js绑定事件和解绑事件
2017/04/27 Javascript
关于redux-saga中take使用方法详解
2018/02/27 Javascript
Vue监听一个数组id是否与另一个数组id相同的方法
2018/09/26 Javascript
vue+node实现图片上传及预览的示例方法
2018/11/22 Javascript
详解JavaScript原生封装ajax请求和Jquery中的ajax请求
2019/02/14 jQuery
vue点击Dashboard不同内容 跳转到同一表格的实例
2020/11/13 Javascript
pyqt4教程之实现半透明的天气预报界面示例
2014/03/02 Python
python使用xauth方式登录饭否网然后发消息
2014/04/11 Python
python操作sqlite的CRUD实例分析
2015/05/08 Python
Python实现控制台中的进度条功能代码
2017/12/22 Python
python3实现磁盘空间监控
2018/06/21 Python
python异步编程 使用yield from过程解析
2019/09/25 Python
python 调整图片亮度的示例
2020/12/03 Python
使用CSS3来匹配横屏竖屏的简单方法
2015/08/04 HTML / CSS
详解如何使用CSS3中的结构伪类选择器和伪元素选择器
2020/01/06 HTML / CSS
使用HTML5拍照示例代码
2013/08/06 HTML / CSS
Java里面如何创建一个内部类的实例
2015/01/19 面试题
汽车销售求职自荐信
2013/10/01 职场文书
毕业生物理教师求职信
2013/10/17 职场文书
高三自我鉴定
2013/10/23 职场文书
税务会计岗位职责
2014/02/18 职场文书
毕业典礼主持词大全
2014/03/26 职场文书
接收函格式
2015/01/30 职场文书
员工工作表扬信
2015/05/05 职场文书
python中的装饰器该如何使用
2021/06/18 Python