如何像Facebook一样创建标题提醒效果?

时间:2010-08-01 09:25:31

标签: javascript jquery facebook effect

如何像facebook一样创建闪烁的标题效果?意味着,当您与某人聊天并收到新消息时,标题开始在原始标题和消息之间切换,通知用户新消息的到达会产生闪烁效果。

AdrianoKF解释

  

请注意窗口标题在收到新聊天消息后,在“来自Foo Bar的新消息”和常规消息之间循环。

3 个答案:

答案 0 :(得分:34)

代码:

(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;
};

}());

用法:

flashTitle("New Message from Matt Lunn");

......或......

flashTitle("New Message from John Smith", 10); // toggles it 10 times.

答案 1 :(得分:11)

设置每隔几秒切换标题的间隔。未经测试的代码:

function flashTitle(pageTitle, newMessageTitle)
{
    if (document.title == pageTitle)
    {
        document.title = newMessageTitle;
    }
    else
    {
        document.title = pageTitle;
    }
}

setInterval("flashTitle('Facebook', 'New message from John Doe!')", 800);

答案 2 :(得分:1)

setInterval("var x='www.WHAK.com/Packer/',y='WHAK.com/Packer/',z=document;z.title=z.title==x?y:x",900);