Advertisement
nPhoenix

Text Dialog Animation

Aug 21st, 2019
168
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. var Text = function (object) {
  2.     this.text = object.text;
  3.     this.el = object.el;
  4.     this.total = this.text.length;
  5.     this.current = 0;
  6.     this.timeout;
  7.     this.timeoutAnim = object.timeoutAnim || 300;
  8. };
  9.  
  10. Text.prototype.startAnimation = function () {
  11.     this.timeout = setInterval(() => this.animate(), this.timeoutAnim);
  12. };
  13.  
  14. Text.prototype.animate = function () {
  15.     this.el.innerHTML += this.text[this.current++];
  16.     if (this.current == this.total)
  17.         clearTimeout(this.timeout);
  18. };
  19.  
  20. document.body.innerHTML = "";
  21.  
  22. var anim = new Text({
  23.     text: "Olá, tudo bem? Como vai as coisas?",
  24.     el: document.body,
  25.     timeoutAnim: 100
  26. });
  27. anim.startAnimation();
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement