Text Rotation

Hi,

How can I setup Text which shows ITEM1 the ITEM 2, etc. but without reload of page.

Thanks

1 Like

Hey @ac.afd,

That’s a little vague, can you be more specific or link to a page that has something similar to what you are wanting to do.

Thanks for prompt reply :slightly_smiling_face:

Sorry I saw sometime back, don’t remember that website name. So basically what I want is, for example one’s page is opened Text word/line starts flashing & rotating words/lines from the list automatically.

I’ve once blocs extension but that only changes text once page gets reloaded.

@PeteSharp Fount it, please check

He @ac.afd

Here is an example of how you can do it. This is a mod of a script I found online.

<h1>Here you go <span id="sequence" style="color:red;">starting text</span> pretty cool aye.</h1>
<script>
        var changingText = ['some text', 'some different text', 'again, different text'];

        textSequence(0);
        function textSequence(i) {

            if (changingText.length > i) {
                setTimeout(function() {
                    document.getElementById("sequence").innerHTML = changingText[i];
                    textSequence(++i);
                }, 2000); 

            } else if (changingText.length == i) { 
                textSequence(0);
            }

        }
    </script>

The result is this…

example

6 Likes

@PeteSharp Your solution worked like a charm!!! Thanks a lot :grinning:

1 Like

How do you implement this please?

Hi @kwakukwaku,

Here is a video showing you how to add it to your project. Its very easy.

To edit the text or add more/less… edit this line

 var changingText = ['some text', 'some different text', 'again, different text'];

Change this bit of the code to change the speed, 1000 = 1 sec

 }, 2000); 

The text will adopt what ever styling you have on your page.

2 Likes

Works like a charm :slight_smile:
Thank you!

1 Like