使用JavaScript让网页的title动起来

HTML Title：


代码如下:

<title>你好，Mr-S.R Lee</title>

JavaScript：


代码如下:

<script type="text/javascript">
function scroll() {
//获取title信息。
var titleInfo = document.title;
//获取title第一个汉字（数字、字母）。
//注释：字符串中第一个字符的下标是 0。如果参数 index 不在 0 与 string.length 之间，该方法将返回一个空字符串。
var firstInfo = titleInfo.charAt(0);
//获取第二位到最后的信息。
var lastInfo = titleInfo.substring(1, titleInfo.length);
//拼接输出信息
document.title = lastInfo + firstInfo;
}
//使用setInterval（）方法执行
setInterval("scroll()", 500);
</script>

完整演示代码:


你好，Mr-S.R Lee

function scroll() {
//获取title信息。
var titleInfo = document.title;
//获取title第一个汉字（数字、字母）。
//注释：字符串中第一个字符的下标是 0。如果参数 index 不在 0 与 string.length 之间，该方法将返回一个空字符串。
var firstInfo = titleInfo.charAt(0);
//获取第二位到最后的信息。
var lastInfo = titleInfo.substring(1, titleInfo.length);
//拼接输出信息
document.title = lastInfo + firstInfo;
}
//使用setInterval（）方法执行
setInterval("scroll()", 500);

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

赞 (0)

相关推荐

  • 一个JS函数搞定网页标题(title)闪动效果

    复制代码 代码如下: <html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title></head><body><script language="JavaScript"> step=0 function fla

  • JavaScript获取当前网页标题（title）的方法

    本文实例讲述了JavaScript获取当前网页标题(title)的方法.分享给大家供大家参考.具体如下: JS中的document.title可以获取当前网页的标题 <!DOCTYPE html> <html> <head> <title>jb51.net</title> </head> <body> current document's title is: <script> document.write(do

  • JS实现闪动的title消息提醒效果

    有时候我们需要提醒用户,有新的消息,这个可以使用下面的方法实现. 效果就是网页窗口在没有获取焦点并且最小化的时候,网页窗口的标题栏"title"显示的内容为"[ ]","[新消息]"的闪烁效果. <script language="JavaScript"> setTimeout('flash_title()',2000); //2秒之后调用一次 function flash_title() { //当窗口效果为最小

  • 利用JS实现浏览器的title闪烁

    主要是通过setTimeout方法设置一个定时器,切换消息提示,从而达title到消息提示的闪烁. 复制代码 代码如下: <html>  <head>      <title>JS效果-浏览器标题栏闪烁</title>      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />      <script type

  • JavaScript Title、alt提示（Tips）实现源码解读

    JavaScript Title、alt提示（Tips）实现源码解读

    而对于图片标签img也有一个alt属性可以起到类似的作用.但很显然这种提示框太单调了,为此有人用JavaScript实现了漂亮的提示框效果,这种效果常用在WEB游戏中,其中下图的网易邮箱与迅雷影视页面就用到这种效果,虽然彼此实现效果有些差异,但整体实现思路是不变的.为了方便大家了解实现的细节,以方便定制自己想要的效果,我上网找了一段不错的源码,并对其进行了详细的注释,希望对大家有帮助. 含注释代码: 复制代码 代码如下: /************************************

  • js 增强型title信息提示效果

    js 增强型title信息提示效果

    效果图:演示代码: .xstooltip { visibility: hidden; position: absolute; top: 0; left: 0; z-index: 2; font: normal 8pt sans-serif; padding: 3px; border: solid 1px; } 显示注释 jb51www.jb51.net Time spent: 00:00:08 Page viewed: 4 Browser: Mozilla – 1.7.11 Operating

  • js鼠标移动在title中显示图片的效果代码

    1.js代码 复制代码 代码如下: //***********默认设置定义.********************* tPopWait=50;//停留tWait豪秒后显示提示. tPopShow=5000;//显示tShow豪秒后关闭提示 showPopStep=20; popOpacity=99; //***************内部变量定义***************** sPop=null; curShow=null; tFadeOut=null; tFadeIn=null; tFa

  • ToolTip 通过Js实现代替超链接中的title效果

    自定义Tooltip特效 body ul { list-style: none; } body li { margin: 60px; } div { border: 1px solid #CCC; padding: 10px; background: #dff5ff; margin-left: 30px; } function initEvent() { var links = document.getElementsByTagName("a"); for (var i = 0; i

  • Jquery修改页面标题title其它JS失效的解决方法

    Jquery代码 复制代码 代码如下: $("title").html("hello"); 后来只好用下面这段js代码来实现 Js代码 复制代码 代码如下: document.title="hello";

  • 基于JavaScript实现 网页切出 网站title变化代码

    废话不多说了,直接给大家贴代码了,具体代码如下所示: <!DOCTYPE html> <html> <head> <meta charset="UTF-"> <title>这里是网站标题</title> </head> <body> <script type="text/javascript"> document.body.onfocus = function

  • js下用层来实现select的title提示属性

    复制代码 代码如下: <script>              function opts(selectObj){                          var optDivs=document.createElement("div");                          var objTable=document.createElement("table");                          var ob

  • js每次Title显示不同的名言

    每次都有不同的名言出来. 实现方法: 1.上传title.js到网站目录 2.在页面相应位置添加以下代码: <script type="text/javascript" src="file/title.js" charset="UTF-8"></script> 3.title.js代码如下: _VC_DocumentTitles = new Array('世间的活动,缺点虽多,但仍是美好的', '真正没有资格谈明天的人,是

随机推荐