JavaScript : Flash Title For New Message

Whenever you chat with your friends on Facebook or Gmail, you often see new blinking message which appears on Title of browser when you’re on other webpage or tab.

I always feel how they would notify us with this message. After some research I found that it is a small JavaScript which makes this happen.

This tutorial post will help you to flash Title of web browser for new message.

Let’s look at some JavaScript stuff

    var message_interval = null;
    var user = 'Zainul';
    var message = 'Hello There';
    var odd_even = 0;
    var old_title = document.title;

    /**
     * Show title message when new message arrives 
     */
    function showTitleMessage() {
        // set time interval
        message_interval = setInterval(function() {
            // reset title and execute next task when user returs to this tab
            $(window).bind('focus', function() {
                clearInterval(message_interval);
                document.title = old_title;
                // execute next task
                // use callback function for next task
            });

            //set message
            document.title = odd_even ? message : user + ' says...';
            // set odd or even
            odd_even = !odd_even;

        }, 2000);
    }

You can use this tutorial to show new message arrives when you are looking at message list, example Stack overflow questions, Chat message.

Hope this tutorial will help you.