Typing rotation text

[r_botman]

Schermopname 2020-01-09 om 10.11.34.zip (3.8 MB) Hi all,

I wonder if this can be done in blocs too?

It is a Typing Rotation text.

See video

[PeteSharp]

So basically this, but with typing text. Yes, It is possible to modify this to work like that.

Text Rotation

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").innerH…

[r_botman]

Thanks @PeteSharp. How to make that Typing Animation? Do you know?

[PeteSharp]

It should be straight forward. I’m about to go to bed though it’s late here in NZ. If no one posts the code I’ll have a look tomorrow.

[r_botman]

Great. Thanks and have a good night! Must be beautiful there in NZ!!! You are lucky

[PeteSharp]

I think you get used to it. With exception to when you travel to new places.

Well I am having a little trouble adding it.

I am very much still learning JavaScript. I’ll tag in the “big guns”

@Pealco do you have a solution the text displaying one letter at a time in the above script.

[Pealco]

Hello @PeteSharp yesterday when I trying to put that working I found a way to do it letter by letter as a typewriter, try this if it is what you need:

https://blocs.pt/change_text_like_typewriter.html

[PeteSharp]

Thats the one, looks more complicated than what I was trying lol. I had it typing one letter at a time, but was only ever showing one letter as well lol.

Thanks @Pealco .

This should be turned into a bric.

[r_botman]

Great and Thanks @PeteSharp and @Pealco. Will try this.

[r_botman]

Thanks again @Pealco. When I copy your code into a code widget there is no typing and changing text. Any idea what I’m doing wrong?

[r_botman]

Found it out already @Pealco. Works great! Thanks again!

[apswoodwork]

Hi @r_botman
What did you need to do?
Looks like a keeper

[r_botman]

Hi @apswoodwork. Just only put the first HTML part in the code widget and add the rest of that code to the page setting Add Code in the Header. Then it works. Clear enough?

[apswoodwork]

Sorted, ta.

[apswoodwork]

Hi.
So I’ve added this to a site I’m updating to the end of a h2, but at smaller breakpoints this bounces between 1 and 2 lines.
I’ve tried to get my head around flex sizing to set a bloc height with dynamic H2 content but I don’t follow it.
Can it be done?
http://test.apswoodwork.uk/

[PeteSharp]

You can apply a custom class and change the text size per break point.

[apswoodwork]

Of course. Obvious really, cheers!

[r_botman]

Hi @Pealco. I’m using the typewriter rotation text as your code, but when I put the code in the code widget it works.

Hospitality <span style="color:#E75B00;font-weight:bold" Specialists

When I save the project and open it again the rotation text is gone.

Hospitality Specialists

How is that possible?

[r_botman]

[r_botman]