Full version: jsB@nk » Text » Writting » Simple JavaScript Typing Text onClick
URL: https://www.javascriptbank.com/simple-javascript-typing-text-onclick.html
With this JavaScript typing text script, you can use to spell out a string of text, letter by letter. This JavaScript code example provides 3 ways to type our strings: add to existing text, replace it completely and repeat text if you like. Very easy to implement and use!This is just a JavaScript effect, if you need to find typing test JavaScript, let try JavaScript Typing Test.
Full version: jsB@nk » Text » Writting » Simple JavaScript Typing Text onClick
URL: https://www.javascriptbank.com/simple-javascript-typing-text-onclick.html
<script type="text/javascript">// Created by: Ilya Gerasimenko | http://www.gerasimenko.com// This script downloaded from www.JavaScriptBank.com// Text to typevar stringOfText1 = '... with a new string of text. Convenient for those "read more..." links.';var stringOfText2 = ' spots on the same page; the animations will be consecutive.';var stringOfText3 = 'Click (and keep clicking) here to retype this text over and over. You don\'t have to, but you can.';// Animationvar textHolder;var textTarget;var letter;var index;var printing;var waiting = false;// StartspellString = function (oId,str) { if (waiting == false) { index = 0; waiting = true; textTarget = document.getElementById(oId); textTarget.innerHTML = ''; textHolder = str.split(''); sendToPrint(); }}// AnimationsendToPrint = function () { if (index<textHolder.length) { printing = window.setTimeout( function () { getLetter(textTarget,index); },1); } else { waiting = false; }}getLetter = function (textTarget,index) { letter = document.createTextNode(textHolder[index]); if (letter.value == '\\') letter.value = ''; printLetter(textTarget,letter);}printLetter = function (textTarget,letter) { textTarget.appendChild(letter); window.clearTimeout(printing); index++; sendToPrint();}// Created by: Simon Willison | http://simon.incutio.com/function addLoadEvent(func) { var oldonload = window.onload; if (typeof window.onload != 'function') { window.onload = func; } else { window.onload = function() { if (oldonload) { oldonload(); } func(); } }}addLoadEvent(function () {document.getElementById('clickhere1').onclick = function () { spellString('typehere1',stringOfText1); }document.getElementById('clickhere2').onclick = function () { spellString('typehere2',stringOfText2); }document.getElementById('keepclicking').onclick = function () { spellString('keepclicking',stringOfText3); } });</script><!--/* This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com*/--><div style="text-align: left; width: 70%;"><p id="typehere1"><span id="clickhere1">Click here to <em>replace</em> this text ...</span></p><p>Can be used in several<span id="typehere2">... <span id="clickhere2">(click here to <em>read more</em>)</span></span></p><p id="keepclicking">Click (and keep clicking) here to <em>retype this text over and over</em>.</p></div>