Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Typing Text Animation

Just wondering if anyone could help with an issue I am having.

I have a working "Text Changer" and it works fine. The issue I am having is that I want the changing text to type itself out. Below I have attached a JS fiddle of the working script.

<h1 class="intro-title">This is some text 
<span id="changer">This text changes</span></h1>

<script>    var words = ["changes to this", "changes to that", "changes   to there"];
var i = 0;
var text = "This text changes";
function _getChangedText() {
  i = (i + 1) % words.length;
  return text.replace(/This text changes/, words[i]);
}
function _changeText() {
  var txt = _getChangedText();
  document.getElementById("changer").innerHTML = txt;
}
setInterval("_changeText()", 1800);</script>

https://jsfiddle.net/g59phn0b/ - Current Code

I have also added a link of what I would like the text to do.

https://jsfiddle.net/7K3UE/ - Desired effect

If anyone can assist, it would be much appreciated.

like image 912
Ben Avatar asked May 25 '26 00:05

Ben


1 Answers

You can use a jquery plugin for that. Check out typed.js.

Here's the link : http://www.mattboldt.com/demos/typed-js/

like image 155
Ashish Avatar answered May 26 '26 13:05

Ashish



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!