Advertisement
Guest User

Untitled

a guest
Oct 18th, 2019
95
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.78 KB | None | 0 0
  1. /* TypeWriter Script */
  2.  
  3. jQuery(document).ready(function(e) {
  4. var TxtType = function(el, toRotate, period) {
  5. this.toRotate = toRotate;
  6. this.el = el;
  7. this.loopNum = 0;
  8. this.period = parseInt(period, 10) || 2000;
  9. this.txt = '';
  10. this.tick();
  11. this.isDeleting = false;
  12. };
  13.  
  14. TxtType.prototype.tick = function() {
  15. var i = this.loopNum % this.toRotate.length;
  16. var fullTxt = this.toRotate[i];
  17.  
  18. if (this.isDeleting) {
  19. this.txt = fullTxt.substring(0, this.txt.length - 1);
  20. } else {
  21. this.txt = fullTxt.substring(0, this.txt.length + 1);
  22. }
  23.  
  24. this.el.innerHTML = '<span class="wrap">'+this.txt+'</span>';
  25.  
  26. var that = this;
  27. var delta = 200 - Math.random() * 100;
  28.  
  29. if (this.isDeleting) { delta /= 2; }
  30.  
  31. if (!this.isDeleting && this.txt === fullTxt) {
  32. delta = this.period;
  33. this.isDeleting = true;
  34. } else if (this.isDeleting && this.txt === '') {
  35. this.isDeleting = false;
  36. this.loopNum++;
  37. delta = 500;
  38. }
  39.  
  40. setTimeout(function() {
  41. that.tick();
  42. }, delta);
  43. };
  44.  
  45. window.onload = function() {
  46. var elements = document.getElementsByClassName('typewrite');
  47. for (var i=0; i<elements.length; i++) {
  48. var toRotate = elements[i].getAttribute('data-type');
  49. var period = elements[i].getAttribute('data-period');
  50. if (toRotate) {
  51. new TxtType(elements[i], JSON.parse(toRotate), period);
  52. }
  53. }
  54. // INJECT CSS
  55. var css = document.createElement("style");
  56. css.type = "text/css";
  57. css.innerHTML = ".typewrite > .wrap { border-right: 0.08em solid #fff}";
  58. document.body.appendChild(css);
  59. };
  60. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement