javascript 如何创建像 Facebook 一样的标题提醒效果?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3381462/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to create the title alert effect like Facebook?
提问by Starx
How to create flashing title effect like facebook? Means, when you are chatting with someone and a new message is received, a title starts to switch between the original title and a message informing user of the arrival of new message giving a flashing effect.
如何创建像facebook一样的闪烁标题效果?意思是,当你和某人聊天并收到新消息时,标题开始在原始标题和通知用户新消息到达的消息之间切换,并具有闪烁效果。
Explanation by AdrianoKF:
AdrianoKF 的解释:
Notice the window title cycling between something like "New message from Foo Bar" and the regular one after receiving a new chat message.
请注意窗口标题在“来自 Foo Bar 的新消息”和收到新聊天消息后的常规标题之间循环。
回答by Matt
Code:
代码:
(function () {
var original = document.title;
var timeout;
window.flashTitle = function (newMsg, howManyTimes) {
function step() {
document.title = (document.title == original) ? newMsg : original;
if (--howManyTimes > 0) {
timeout = setTimeout(step, 1000);
};
};
howManyTimes = parseInt(howManyTimes);
if (isNaN(howManyTimes)) {
howManyTimes = 5;
};
cancelFlashTitle(timeout);
step();
};
window.cancelFlashTitle = function () {
clearTimeout(timeout);
document.title = original;
};
}());
Usage:
用法:
flashTitle("New Message from Matt Lunn");
... or...
... 或者...
flashTitle("New Message from John Smith", 10); // toggles it 10 times.
回答by BoltClock
Set an interval that switches the title every few seconds. Untested code:
设置每隔几秒切换一次标题的间隔。未经测试的代码:
function flashTitle(pageTitle, newMessageTitle)
{
if (document.title == pageTitle)
{
document.title = newMessageTitle;
}
else
{
document.title = pageTitle;
}
}
setInterval("flashTitle('Facebook', 'New message from John Doe!')", 800);
回答by Dave Brown
setInterval("var x='www.WHAK.com/Packer/',y='WHAK.com/Packer/',z=document;z.title=z.title==x?y:x",900);

