Question

I’m looking to rotate a web page document title using JS. So for example:

Change to Domain.com to New Messgae - Domain.com and then back to Domain.com and so on, very similar to how Facebook does it with the new messages when using chat.

I have looked into using SetInterval but it only excepts one expression? Is it possible to change this or is using SetInterval the wrong function to use?

$(document).ready(function () {

    setInterval(function () {
            $(document).attr('title', 'New Message — Domain.com');
        },
        2000);

});

Answer 1

Right now, you keep setting the same new title every 2 seconds, i.e. you won’t see a change after the first change. You need to store the old title and alternate between two states, displaying the old and new titles:

var oldTitle, timerId;

function flashTitle(newTitle) {
  var state = false;
  oldTitle = document.title;  // save old title
  timerId = setInterval(flash, 2000);

  function flash() {
    // switch between old and new titles
    document.title = state ? oldTitle : newTitle;
    state = !state;
  }
}

function clearFlash() {
  clearInterval(timerId);
  document.title = oldTitle; // restore old title
}