JS实现超简洁网页title标题跑动闪烁提示效果代码


Posted in Javascript onOctober 23, 2015

本文实例讲述了JS实现超简洁网页title标题跑动闪烁提示效果代码。分享给大家供大家参考,具体如下:

这里演示不几行JS代码实现的网页Title文字跑动效果,类似有消息时的标题闪烁提醒功能,在JS代码中,当变量_record累加到3是,将其赋值为1。相当于无限循环。需要显示的消息提示内容可自拟哦。

运行效果截图如下:

JS实现超简洁网页title标题跑动闪烁提示效果代码

在线演示地址如下:

具体代码如下:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>JS实现title标题闪烁提示信息</title>
</head>
<body>
<script type="text/javascript">
_record = 0;
var myTitle = document.title;
function titleBlink(){
  _record++;
  if(_record==3){//当变量_record累加到3是,将其赋值为1。相当于无限循环。
    _record=1;
  }
  if(_record==1){
    document.title='【  】'+myTitle;
  }
  if(_record==2){
    document.title='【新消息】'+myTitle;
  }
  setTimeout("titleBlink()",500);//调节时间,单位毫秒。
}
titleBlink();
</script>
<center><h1>几行js实现闪烁的title。</h1></center>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
</div>
</body>
</html>

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

Javascript 相关文章推荐
jQuery each()小议
Mar 18 Javascript
JS获取整个页面文档的实现代码
Dec 15 Javascript
jQuery简单几行代码实现tab切换
Mar 10 Javascript
Bootstrap 最常用的JS插件系列总结(图片轮播、标签切换等)
Jul 14 Javascript
jQuery中常用动画效果函数(日常整理)
Sep 17 Javascript
微信小程序 LOL 英雄介绍开发实例
Sep 30 Javascript
bootstrap实现图片自动轮播
Dec 21 Javascript
Angular.js ng-file-upload结合springMVC的使用教程
Jul 10 Javascript
vue中mint-ui的使用方法
Apr 04 Javascript
vue项目创建步骤及路由router
Jan 14 Javascript
angular共享依赖的解决方案分享
Oct 15 Javascript
JavaScript 中的执行上下文和执行栈实例讲解
Feb 25 Javascript
seajs加载jquery时提示$ is not a function该怎么解决
Oct 23 #Javascript
浅析Node.js 中 Stream API 的使用
Oct 23 #Javascript
jQuery实现右侧显示可向左滑动展示的深色QQ客服效果代码
Oct 23 #Javascript
js显示当前日期时间和星期几
Oct 22 #Javascript
js检测用户输入密码强度
Oct 22 #Javascript
使用JQuery实现Ctrl+Enter提交表单的方法
Oct 22 #Javascript
实例详解angularjs和ajax的结合使用
Oct 22 #Javascript
You might like
preg_match_all使用心得分享
2014/01/31 PHP
PHP include任意文件或URL介绍
2014/04/29 PHP
thinkphp5.0自定义验证规则使用方法
2017/11/16 PHP
PHP实现的多维数组去重操作示例
2018/07/21 PHP
对laravel的session获取与存取方法详解
2019/10/08 PHP
jquery下div 的resize事件示例代码
2014/03/09 Javascript
jQuery中slideUp()方法用法分析
2014/12/24 Javascript
JavaScript中的substr()方法使用详解
2015/06/06 Javascript
Jquery1.9.1源码分析系列(十五)动画处理之外篇
2015/12/04 Javascript
再谈JavaScript异步编程
2016/01/27 Javascript
ES6概念 ymbol.for()方法
2016/12/25 Javascript
详解Angularjs 如何自定义Img的ng-load 事件
2017/02/15 Javascript
AngularJS 最常用的八种功能(基础知识)
2017/06/26 Javascript
es6系列教程_ Map详解以及常用api介绍
2017/09/25 Javascript
浅析Vue实例以及生命周期
2018/08/14 Javascript
js实现每日签到功能
2018/11/29 Javascript
laravel实现中文和英语互相切换的例子
2019/09/30 Javascript
Vue 技巧之控制父类的 slot
2020/02/24 Javascript
[54:10]Spirit vs NB Supermajor小组赛 A组败者组决赛 BO3 第一场 6.2
2018/06/03 DOTA
[08:17]Ti9 现场cosplay
2019/09/10 DOTA
在Django的通用视图中处理Context的方法
2015/07/21 Python
Python 3.3实现计算两个日期间隔秒数/天数的方法示例
2019/01/07 Python
使用Python做定时任务及时了解互联网动态
2019/05/15 Python
Django 1.10以上版本 url 配置注意事项详解
2019/08/05 Python
Django使用Jinja2模板引擎的示例代码
2019/08/09 Python
详解使用python3.7配置开发钉钉群自定义机器人(2020年新版攻略)
2020/04/01 Python
如何打包Python Web项目实现免安装一键启动的方法
2020/05/21 Python
Python实现迪杰斯特拉算法并生成最短路径的示例代码
2020/12/01 Python
便携式太阳能系统的创新者:GOAL ZERO
2018/02/04 全球购物
三星加拿大官方网上商店:Samsung CA
2020/12/18 全球购物
为什么UNION ALL比UNION快
2016/03/17 面试题
2014年班组长工作总结
2014/11/20 职场文书
MySQL七大JOIN的具体使用
2022/02/28 MySQL
js面向对象编程OOP及函数式编程FP区别
2022/07/07 Javascript
CSS中理解层叠性及权重如何分配
2022/12/24 HTML / CSS
postgresql如何找到表中重复数据的行并删除
2023/05/08 MySQL