Turn off blinking cursor at the end

[yuehkchou]

Hi, I am currently using the Typewriterjs for animated header.
I was wondering if there is a way to remove or in the least pause the blinking cursor once it finishes playing. Tried using the changeSetting method but that doesn't seem to work either.

Am I doing something wrong?

 var typewriter = new Typewriter(app, {
     loop: false,
     blinkSpeed: 35
 });


 typewriter.typeString('Testing Testing Testing')
     .pauseFor(3500)
     .changeSettings({ "animateCursor": false })
     .start();

Thank you in advance

[coltmans21]

+1
I just arrived to the same issue. A fix would be nice :)

[tameemsafi]

I will look into this issue, however, I am in the process of releasing a new version which is created with typescript.

[realgs]

Any news here?

[tameemsafi]

@realgs I will add this feature very soon

[realgs]

Thanks for a quick response! If only I were be able to make the changeSettings() function work it'd be easy to achieve the result just by replacing our cursor to cursor: ''. Do you have changeSettings() function? I can't see it in your project's description.

[tameemsafi]

@realgs @yuehkchou You can use the callFunction method in order to adjust the styling of the cursor when animation is complete. The first parameter will be an object containing all the elements.

Example: https://jsfiddle.net/8qeujc4s/5/

[bobrosoft]

Doing it with next workaround:

<Typewriter
  options={{
    delay: 75,
  }}
  onInit={typewriter => {
    typewriter
      .typeString(
        `First line<br/>Second line`,
      )
      .callFunction(state => {
        state.elements.cursor.setAttribute('hidden', 'hidden');
        typewriter.stop();
      })
      .start();
  }}
/>