Moin Gino,
ich habe eine frage bezüglich des Typewriters im Developer Stil. Ich habe den Templatecode mal kopiert und in einen Beitrag via HTML-BBCode eingefügt:
<script data-relocate="true">
function setupTypewriter(t) {
var HTML = t.innerHTML;
t.innerHTML = "";
var cursorPosition = 0,
tag = "",
writingTag = false,
tagOpen = false,
typeSpeed = 100,
tempTypeSpeed = 0;
var type = function() {
if (writingTag === true) {
tag += HTML[cursorPosition];
}
if (HTML[cursorPosition] === "<") {
tempTypeSpeed = 0;
if (tagOpen) {
tagOpen = false;
writingTag = true;
} else {
tag = "";
tagOpen = true;
writingTag = true;
tag += HTML[cursorPosition];
}
}
if (!writingTag && tagOpen) {
tag.innerHTML += HTML[cursorPosition];
}
if (!writingTag && !tagOpen) {
if (HTML[cursorPosition] === " ") {
tempTypeSpeed = 0;
}
else {
tempTypeSpeed = (Math.random() * typeSpeed) + 50;
}
t.innerHTML += HTML[cursorPosition];
}
if (writingTag === true && HTML[cursorPosition] === ">") {
tempTypeSpeed = (Math.random() * typeSpeed) + 50;
writingTag = false;
if (tagOpen) {
var newSpan = document.createElement("span");
t.appendChild(newSpan);
newSpan.innerHTML = tag;
tag = newSpan.firstChild;
}
}
cursorPosition += 1;
if (cursorPosition < HTML.length - 1) {
setTimeout(type, tempTypeSpeed);
}
};
return {
type: type
};
}
var typer = document.getElementById('Typewriter');
Typewriter = setupTypewriter(Typewriter);
Typewriter.type();
</script>
Alles anzeigen
Und natürlich auch das CSS angepasst
/* ================================================================ Div-Box Animation */
.linuxvar-highlight{
color: #C0AD60;
}
.linuxstring-highlight {
color: rgba(254, 60, 95, 0.89);
}
#typewriter_linuxBox {
width: 260px;
font-size: 1em;
margin: 20px 10px;
font-family: "Courier New";
&:after {
content: "|";
animation: blink 900ms steps(2, start) infinite;
-webkit-animation: blink 900ms steps(2, start) infinite;
-moz-animation: blink 900ms steps(2, start) infinite;
-o-animation: blink 900ms steps(2, start) infinite;
}
}
Alles anzeigen
<pre id="typewriter_linuxBox">
<span class="linuxvar-highlight">root@domain.tld: ~#</span> apt-get update
Preconfiguring packages <span class="linuxstring-highlight">...</span>
Reading database <span class="linuxstring-highlight">30466 files</span>
Selecting previosly unselected package <span class="linuxstring-highlight">libssh2-1_1-7-0_amd64.deb</span>
/etc/apt/trusted.gpg.d/php.[<span class="string-highlight">'100%[=================>] 2.19K --.-KB/s in 0s'</span>;
<span class="linuxvar-highlight">root@domain.tld: ~#</span> </pre>
Leider ist keine Laufschrift zu sehen wie im Header des Stils 
was vergesse ich?, würdest du mir mit einem winkenden Zaunpfahl helfen? 
https://www.w3schools.com/howto/howto_css_parallax.asp
