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 相关文章推荐
jQuery左右滚动支持图片放大缩略图图片轮播代码分享
Aug 26 Javascript
JavaScript必知必会(十) call apply bind的用法说明
Jun 08 Javascript
BootStrap智能表单实战系列(四)表单布局介绍
Jun 13 Javascript
微信小程序 开发经验整理
Feb 15 Javascript
前端常见跨域解决方案(全)
Sep 19 Javascript
Angular6笔记之封装http的示例代码
Jul 27 Javascript
JavaScript创建对象方法实例小结
Sep 03 Javascript
Vue路由之JWT身份认证的实现方法
Aug 26 Javascript
Vuex实现数据增加和删除功能
Nov 11 Javascript
深入浅析golang zap 日志库使用(含文件切割、分级别存储和全局使用等)
Feb 19 Javascript
详解element-ui 表单校验 Rules 配置 常用黑科技
Jul 11 Javascript
Vuex实现购物车小功能
Aug 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
DC动漫人物排行
2020/03/03 欧美动漫
php中apc缓存使用示例
2013/12/25 PHP
PHP执行SQL文件并将SQL文件导入到数据库
2015/09/17 PHP
Yii2 加载css、js 载静态资源的方法
2017/03/10 PHP
利用JQuery为搜索栏增加tag提示
2009/06/22 Javascript
基于JQuery的一句代码实现表格的简单筛选
2010/07/26 Javascript
javascript向后台传送相同属性的参数即数组参数
2014/02/17 Javascript
JS中怎样判断undefined(比较不错的方法)
2014/03/27 Javascript
drag-and-drop实现图片浏览器预览
2015/08/06 Javascript
angular.js之路由的选择方法
2016/09/24 Javascript
AngularJS用户选择器指令实例分析
2016/11/04 Javascript
Vue2组件tree实现无限级树形菜单
2017/03/29 Javascript
详解Angular结合zTree异步加载节点数据
2018/01/20 Javascript
bmob js-sdk 在vue中的使用教程
2018/01/21 Javascript
微信小程序scroll-view组件实现滚动动画
2018/01/31 Javascript
js循环map 获取所有的key和value的实现代码(json)
2018/05/09 Javascript
vue实现自定义多选按钮
2020/07/16 Javascript
vue mvvm数据响应实现
2020/11/11 Javascript
Python单链表的简单实现方法
2014/09/23 Python
Python命名空间的本质和加载顺序
2018/12/17 Python
对python捕获ctrl+c手工中断程序的两种方法详解
2018/12/26 Python
PyQt5 如何让界面和逻辑分离的方法
2020/03/24 Python
Django Serializer HiddenField隐藏字段实例
2020/03/31 Python
Python 操作 PostgreSQL 数据库示例【连接、增删改查等】
2020/04/21 Python
python 通过文件夹导入包的操作
2020/06/01 Python
Python新手学习装饰器
2020/06/04 Python
通过cmd进入python的步骤
2020/06/16 Python
Python中正则表达式对单个字符,多个字符和匹配边界等使用
2021/01/27 Python
车间主管岗位职责
2013/11/14 职场文书
2013年保送生自荐信格式
2013/11/20 职场文书
少先队入队活动方案
2014/02/08 职场文书
在校实习生求职信
2014/06/18 职场文书
公司备用金管理制度
2015/08/04 职场文书
2016年5月份红领巾广播稿
2015/12/21 职场文书
《圆明园的毁灭》教学反思
2016/02/16 职场文书
掌握这项技巧,一年阅读300本书不是梦
2019/09/12 职场文书