JavaScript实现标题栏文字轮播效果代码


Posted in Javascript onOctober 24, 2015

本文实例讲述了JavaScript实现标题栏文字轮播效果代码。分享给大家供大家参考,具体如下:

这里演示的JS文字轮播,显示在标题栏区域,以前个人主页时候经常见到的效果,不过现在都规范了,标题栏一般都不加入这种效果了。但是可以学习一下JS制作实现一些文字特效,运行效果后请查看标题栏。

运行效果截图如下:

JavaScript实现标题栏文字轮播效果代码

在线演示地址如下:

具体代码如下:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>文字循环出现</title>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript">
var message = new Array();
message[0] = "欢迎光临三水点靠木";
message[1] = "这里有javascript";
message[2] = "网页特效";
message[3] = "图片和背景特效等";
message[4] = "非常多的资源";
message[5] = "你一定会有所收获的"; 
message[6] = "欢迎你再次光临";
message[7] = "";
var reps = 2;
var speed = 60;
var p = message.length;
var T = "";
var C = 0;
var mC = 0;
var s = 0;
var sT = null;
if (reps < 1) reps = 1;
function doTheThing() {
T = message[mC];
A();
}
function A() {
s++;
if (s > 9) { s = 1;}
if (s == 1) { document.title = '|||★★★★★=====|||----- ['+T+' -----'; }
if (s == 2) { document.title = '|||=★★★★★====|||----- ['+T+' -----'; }
if (s == 3) { document.title = '|||==★★★★★===|||----- ['+T+' -----'; }
if (s == 4) { document.title = '|||===★★★★★==|||----- ['+T+' -----'; }
if (s == 5) { document.title = '|||====★★★★★=|||----- ['+T+' -----'; }
if (s == 6) { document.title = '|||=====★★★★★|||----- ['+T+' -----'; }
if (s == 7) { document.title = '|||====★★★★★=|||----- ['+T+' -----'; }
if (s == 8) { document.title = '|||===★★★★★==|||----- ['+T+' -----'; }
if (s == 9) { document.title = '|||=★★★★★===|||----- ['+T+' -----'; }
if (C < (8 * reps)) {
sT = setTimeout("A()", speed);
C++;
}
else {
C = 0;
s = 0;
mC++;
if(mC > p - 1) mC = 0;
sT = null;
doTheThing();
  }
}
doTheThing();
</script>
</body>
</html>

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

Javascript 相关文章推荐
网页里控制图片大小的相关代码
Jun 25 Javascript
Javascript 刷新全集常用代码
Nov 22 Javascript
JavaScript中把数字转换为字符串的程序代码
Jun 19 Javascript
jquery ajax局部加载方法详解(实现代码)
May 12 Javascript
JS实现星星评分功能实例代码(两种方法)
Jun 09 Javascript
JS实现的简单标签点击切换功能示例
Sep 21 Javascript
React Native中导航组件react-navigation跨tab路由处理详解
Oct 31 Javascript
深入理解JavaScript和TypeScript中的class
Apr 22 Javascript
浅谈Redux中间件的实践
Jul 27 Javascript
vue-cli脚手架的安装教程图解
Sep 02 Javascript
原生js实现点击轮播切换图片
Feb 11 Javascript
Taro小程序自定义顶部导航栏功能的实现
Dec 17 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
js中对函数设置默认参数值的3种方法
Oct 23 #Javascript
You might like
一个更简单的无限级分类菜单代码
2007/01/16 PHP
Thinkphp无限级分类代码
2015/11/11 PHP
PHP 用session与gd库实现简单验证码生成与验证的类方法
2016/11/15 PHP
php实现文件管理与基础功能操作
2017/03/21 PHP
php显示页码分页类的封装
2017/06/08 PHP
JQuery 网站换肤功能实现代码
2009/11/02 Javascript
javascript中用星号表示预录入内容的实现代码
2011/01/08 Javascript
JavaScript中的replace()方法使用详解
2015/06/06 Javascript
CKEditor无法验证的解决方案(js验证+jQuery Validate验证)
2016/05/09 Javascript
JS模态窗口返回值兼容问题的完美解决方法
2016/05/28 Javascript
基于Bootstrap+jQuery.validate实现表单验证
2016/05/30 Javascript
JavaScript面试题(指针、帽子和女朋友)
2016/11/23 Javascript
js上传图片预览的实现方法
2017/05/09 Javascript
Vue响应式原理深入解析及注意事项
2017/12/11 Javascript
在create-react-app中使用css modules的示例代码
2018/07/31 Javascript
微信小程序实现单选功能
2018/10/30 Javascript
vue3.0中的双向数据绑定方法及优缺点
2019/08/01 Javascript
Vuex实现购物车小功能
2020/08/17 Javascript
python远程登录代码
2008/04/29 Python
Python常用列表数据结构小结
2014/08/06 Python
Python下线程之间的共享和释放示例
2015/05/04 Python
让Python更加充分的使用Sqlite3
2017/12/11 Python
用python实现将数组元素按从小到大的顺序排列方法
2018/07/02 Python
对python中的try、except、finally 执行顺序详解
2019/02/18 Python
PyCharm安装Markdown插件的两种方法
2019/06/24 Python
Django Channel实时推送与聊天的示例代码
2020/04/30 Python
Python常用库Numpy进行矩阵运算详解
2020/07/21 Python
Scrapy 配置动态代理IP的实现
2020/09/28 Python
Sneaker Studio波兰:购买运动鞋
2018/04/28 全球购物
Revolution Beauty美国官网:英国知名化妆品网站
2018/07/23 全球购物
留学自荐信的技巧
2013/10/17 职场文书
产品销售员岗位职责
2013/12/18 职场文书
因公司原因离职的辞职信范文
2015/05/12 职场文书
故意伤害罪辩护词
2015/05/21 职场文书
自荐信大全
2019/03/21 职场文书
导游词之介休绵山
2019/12/31 职场文书