How to put scrolling text in title tag?

Question

I want to make text of title scrollable, I make the code as under it scrolls fine but the text I entered is displayed without space, meaning space in string is not considered.

<script type="text/javascript">
    //function for tittle scrolling
    function scrlsts() {
        //var scrltest = " Nature ";
        scrltest=document.title;

        //alert(scrltest);
        scrltest = scrltest.substring(1, scrltest.length) + scrltest.substring(0, 1);

        //alert(scrltest);
        document.title = scrltest;

        setTimeout("scrlsts()", 1000);
    }
    $(document).ready(function() {
        var scrltest = " Nature dff ssfd ";
        document.title=scrltest;
        scrlsts();
    });
</script>

Thanks in advance

possible duplicate of [jQuery scrolling marquee in html page title tag](http://stackoverflow.com/questions/4099011/jquery-scrolling-marquee-in-html-page-title-tag) — Tim B James, May 03 '13 at 08:01
@TimBJames yes sorry i got it but i did not know that before posting question — Yadav Chetan, May 03 '13 at 08:22

score 19 · Accepted Answer · answered May 03 '13 at 08:03

19

Haven't made these for a long time, but this should work:

(function titleScroller(text) {
    document.title = text;
    setTimeout(function () {
        titleScroller(text.substr(1) + text.substr(0, 1));
    }, 500);
}(" Nature dff ssfd "));

answered May 03 '13 at 08:03

Joseph

117,725
30
181
234

1

its not considering the last space means last word and first word scroll combines – Yadav Chetan May 03 '13 at 08:20
I'am replace `(" Nature dff ssfd ")` by `( document.title + " - " )` for use the initial title tag and add a "-"to end. – Jorhel Reyes May 28 '20 at 14:32

Cameron · Answer 2 · 2019-05-28T18:14:07.083

2

I made an easy and simple JavaScript library to accomplish this task.

edited May 28 '19 at 18:14

answered Nov 23 '17 at 23:55

Cameron

1,049
12
24

score 1 · Answer 3 · answered Nov 21 '16 at 05:31

<script type='text/javascript'> 
title = "Your Title";
position = 0;
function scrolltitle() {
    document.title = title.substring(position, title.length) + title.substring(0, position); 
    position++;
    if (position > title.length) position = 0;
    titleScroll = window.setTimeout(scrolltitle,170);
}
scrolltitle();
</script>

To stop the title scroll, just run:

window.clearTimeout(titleScroll);

score 0 · Answer 4 · answered Mar 28 '14 at 07:51

You can try this :

<script>

    var repeat=0 //enter 0 to not repeat scrolling after 1 run, othersise, enter 1
    var title=document.title
    var leng=title.length
    var start=1
    function titlemove() 
    {
        titl=title.substring(start, leng) + title.substring(0, start)
        document.title=titl
        start++
        if (start==leng+1`enter code here`) 
        {
            start=0
            if (repeat==0)
            return
        }
        setTimeout("titlemove()",500)
    }
    if (document.title)
    titlemove()
</script>

nice logic if (start==leng+1`enter code here`) what is meant of enter code here — Yadav Chetan, Mar 29 '14 at 09:04

score 0 · Answer 5 · answered Aug 28 '21 at 17:57

I was playing around with the scrolling code found here to scroll a long string of emoji smilies in the document.title tag. I noticed that the first and last emoji characters in the string would sometimes show up as a square question mark error icon.

After some research about the issue, it looks like JavaScript does not deal well with UTF-16 surrogate pairs. I pieced together a working solution, and I thought I should circle back here and share.

A workaround for my broken emoji scroller is to split the long string of emojis into a character array. I then shift the array and join it into a string before updating the document.title.

This StackOverflow question lead me in the right direction: Split JavaScript string into array of codepoints? (taking into account “surrogate pairs” but not “grapheme clusters”)

<script type = "text/javascript">
  var msg =
    "☹️☠️";
  var chars = Array.from(msg);

  function scrollTitle() {
    chars.push(chars.shift());
    document.title = chars.join("");
    window.setTimeout(scrollTitle, 120);
  }

  (function() {
    scrollTitle();
  })();
</script>

How to put scrolling text in title tag?

5 Answers5

Linked