Mit dieser Variante kannst Du einen animierten Seitentitel auf Deiner Homepage anzeigen lassen.
Kopiere einfach das folgende Skript und füge es in den <head>-Bereich Deiner Webseite ein.
js
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function () {
const titleTexts = [
"Herzlich Willkommen",
"auf DarkNickli`s",
"Tutorials Seite",
];
let index = 0; // aktueller Text
let char = 0; // aktuelles Zeichen im Text
let forward = true; // Richtung: vorwärts (true) oder rückwärts (false)
function animateTitle() {
const current = titleTexts[index];
const output = current.substring(0, char) + " ▌"; // Cursor
document.title = output;
if (forward) {
char++;
if (char > current.length + 5) {
forward = false;
char = current.length;
}
} else {
char--;
if (char < 0) {
forward = true;
char = 0;
index = (index + 1) % titleTexts.length; // zum nächsten Text
}
}setTimeout(animateTitle, 75);}animateTitle(); // Starte die Animation
});
</script>
const titleTexts → Deine Titelzeile zum Leben erweckt.
Die Einträge in titleTexts → werden nacheinander im Browser-Tab angezeigt.
Du kannst sie einfach ändern, um Deine eigene Botschaft darzustellen.
length + 5 → Damit der Text noch eine kurze Pause macht,
bevor der nächste angezeigt wird.
js
index = (index + 1)
index + 1 → Der Index wird erhöht (z. B. von 0 auf 1).
So wird der Index nach dem letzten Text automatisch zurückgesetzt, die Titel wiederholen sich endlos.
Das war's auch schon von mir. 😊
Verfasst am 13.April 2007, aktualisiert am 12.Juli 2025