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 相关文章推荐
从零开始学习jQuery (三) 管理jQuery包装集
Feb 23 Javascript
input 输入框获得/失去焦点时隐藏/显示文字(jquery版)
Apr 02 Javascript
bootstrap data与jquery .data
Jul 07 Javascript
浅析angularJS中的ui-router和ng-grid模块
May 20 Javascript
关于JS Lodop打印插件打印Bootstrap样式错乱问题的解决方案
Dec 23 Javascript
ES6新特性二:Iterator(遍历器)和for-of循环详解
Apr 20 Javascript
bootstrap轮播模板使用方法详解
Nov 17 Javascript
vue-cli开发时,关于ajax跨域的解决方法(推荐)
Feb 03 Javascript
深入浅析angular和vue还有jquery的区别
Aug 13 jQuery
解决vue-quill-editor上传内容由于图片是base64的导致字符太长的问题
Aug 20 Javascript
微信小程序顶部导航栏滑动tab效果
Jan 28 Javascript
javascript实现移动端触屏拖拽功能
Jul 29 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 和 MySQL 时区的一点总结
2008/03/26 PHP
PHP Switch 语句之学习笔记
2013/09/21 PHP
PHP中4种常用的抓取网络数据方法
2015/06/04 PHP
PHP实现搜索相似图片
2015/09/22 PHP
PHP判断文件是否被引入的方法get_included_files用法示例
2016/11/29 PHP
关于 byval 与 byref 的区别分析总结
2007/10/08 Javascript
获取HTML DOM节点元素的方法的总结
2009/08/21 Javascript
基于jquery的监控数据是否发生改变
2011/04/11 Javascript
jquery 中多条件选择器,相对选择器,层次选择器的区别
2012/07/03 Javascript
jQuery使用addClass()方法给元素添加多个class样式
2015/03/26 Javascript
JS正则表达式学习之贪婪和非贪婪模式实例总结
2016/12/26 Javascript
angular.js实现列表orderby排序的方法
2018/10/02 Javascript
使用puppeteer爬取网站并抓出404无效链接
2018/12/20 Javascript
Vue form表单动态添加组件实战案例
2019/09/02 Javascript
JavaScript设计模式之门面模式原理与实现方法分析
2020/03/09 Javascript
[48:31]DOTA2-DPC中国联赛 正赛 Dynasty vs XG BO3 第一场 2月2日
2021/03/11 DOTA
浅谈Python中的数据类型
2015/05/05 Python
CentOS 7下安装Python 3.5并与Python2.7兼容并存详解
2017/07/07 Python
python爬虫系列Selenium定向爬取虎扑篮球图片详解
2017/11/15 Python
Python批处理更改文件名os.rename的方法
2018/10/26 Python
Python3 jupyter notebook 服务器搭建过程
2018/11/30 Python
python中比较两个列表的实例方法
2019/07/04 Python
Django 拆分model和view的实现方法
2019/08/16 Python
python 监测内存和cpu的使用率实例
2019/11/28 Python
解决Python import docx出错DLL load failed的问题
2020/02/13 Python
CSS 3.0文字悬停跳动特效代码
2020/10/26 HTML / CSS
Emma Bridgewater官网:英国餐具制造商
2019/11/24 全球购物
Yankee Candle官网:美国最畅销蜡烛品牌之一
2020/01/05 全球购物
空字符串(“”)和null的区别
2012/11/13 面试题
酷瑞网络科技面试题
2012/03/30 面试题
校长寄语大全
2014/04/09 职场文书
考试诚信承诺书
2014/05/23 职场文书
房地产工程部经理岗位职责
2015/04/09 职场文书
2015年度个人教学工作总结
2015/05/20 职场文书
男生贾里读书笔记
2015/06/30 职场文书