Below is the Example of creating the typing effect like "TYPEWRITER".
Code:
<!DOCTYPE html>
<html>
<body>
<h2>This is the Example of Typewriter.</h2>
<h3> Click the Button below to see the effect. </h3>
<button onclick="typeWriter()">Click me</button>
<p id="demo"></p>
<script>
var i = 0;
var txt = 'Welcome to The Tech Platform.';
var speed = 50;
function typeWriter() {
if (i < txt.length) {
document.getElementById("demo").innerHTML += txt.charAt(i);
i++;
setTimeout(typeWriter, speed);
}
}
</script>
</body>
</html>Output:
When you will click the button "Click me" you will see the TYPEWRITER effect
For better experience and understanding , try it yourself
Source: W3School
The Tech Platform
Comments