How to Browser tab title set it to scrolling/moving?

Question

I have this code

$(function() {
  var message = 'Dont forget us';
  var original;
  var txt1 = ' - ';

  $(window).focus(function() {
    if (original) {
      document.title = original;
    }
  }).blur(function() {
    var title = $('title').text();
    if (title != message) {
      original = title;
    }
    document.title = message + txt1 + original;
  });
});

Which actaully changes Browser tab title to message = 'Dont forget us' when you open new browser tab, and when you come back then again it shows titles page.

But I dont know how to make scrolling or moving from left to right browser title ?

So when someone opens the new tab, it will display: Dont forget us

but i want that this is moving.

please help

Thank you

Possible duplicate of [How to put scrolling text in title tag?](https://stackoverflow.com/questions/16354122/how-to-put-scrolling-text-in-title-tag) — Ben, Feb 11 '18 at 12:17

score 2 · Answer 1 · edited Apr 02 '20 at 18:39

2

You need to use timer setTimeout() and every, say, 500ms remove first letter of title string and append it to the end of the string.

Update: As website title is trimmed it loses the spaces when they get to 1st position. To save them log the title in a variable.

var blurPageTitle = document.title+' ';
changeTitle = function(){
   var letter = document.title[0];
   blurPageTitle = blurPageTitle.substr(1) + letter;
   document.title = blurPageTitle;
   changeTitleTimer = setTimeout(changeTitle, 500);
};
stopChangingTitle = function(){
    clearTimeout(changeTitleTimer);
}

Then just call the functions when you want to start or stop it.

edited Apr 02 '20 at 18:39

Mitko Delibaltov

486
1
6
16

answered Feb 11 '18 at 12:14

Márius Rak

1,356
2
15
35

can you please help me tell me how with code. thanks – john Feb 11 '18 at 12:15
Great Thank you, can you tell me how to call it ? i am still beginer. thanks – john Feb 11 '18 at 12:25

score 0 · Answer 2 · answered Apr 05 '22 at 15:14

Going off what Marius / Mitko did I noticed title spaces were getting added into weird places. Here is my solution to keep the title spacing correct.

setTimeout(rotateTitle, 250);

function rotateTitle(prependSpace = false) {
    const firstChar = document.title.substring(0, 1);
    const nextCharIsSpace = document.title.substring(1, 2) === " ";
    const space = prependSpace === true ? " " : "";

    const newTitle = document.title.substring(1) + space + firstChar;
    document.title = newTitle;

    setTimeout(() => rotateTitle(nextCharIsSpace), 250);
}

How to Browser tab title set it to scrolling/moving?

2 Answers2