JavaScript in HTML5

Das direkte Einbinden von JavaScript auf einer Webseite geschah in früheren HTML-Versionen immer folgendermaßen:

<script language="javascript" type="text/javascript">
<!--
... hier werden die JavaScript-Codezeilen eingefügt.
-->
</script>

Das Auskommentieren

<!--  Codezeilen  -->

war für sehr alte Browser gedacht, um zu verhindern, dass sie die Codezeilen anzeigen. Durch das Verschwinden der Uralt-Browser war das Auskommentieren nicht mehr notwendig. Ab HTML5 wurde u.a. auch das Einbinden von JavaScript wesentlich vereinfacht. Es genügen folgende Codezeilen: Durch das Verschwinden der Uralt-Browser war das Auskommentieren nicht mehr notwendig. Ab HTML5 wurde u.a. auch das Einbinden von JavaScript wesentlich vereinfacht. Es genügen folgende Codezeilen:

<script>
... hier werden die JavaScript-Codezeilen eingefügt. 
</script>

Im Falle des Schneefall-Scripts war es besser, den Code als externe Datei auszulagern. Bei einem längeren JavaScript-Code verliert man in einer HTML-Seite leicht den Überblick. Der Link zum JavaScript wird im Kopf-Bereich der HTML-Datei integriert:

<head>
<title>JavaScript als externe Datei einbinden</title>
<script src="/dateiname.js"></script>
</head>
<body>
...

thumb schneefallWinteridylle mit JavaScript
Schneefall war mit Flash keine große Herausforderung. Die Steuerung der Schneeflocken-Animation konnte mit Hilfe von Flash ActionScript erzeugt werden. Nunmehr übernimmt JavaScript diese Aufgabe, dabei ähnelt der Code sehr jenem von ActionScript.

Mit Variablen jonglieren
JavaScript erlaubt es, die gesamten Webseite beschneien zu lassen oder, dass  Schneeflocken auf ein Hintergrundbild rieseln. Für das Flocken wird nicht unbedingt eine Grafik benötigt. Ein Textzeichen in Form eines Schneekristalls, der Stern (*) ist bereits auf der PC-Tastatur vorhanden. Formatiert in verschiedenen Schriftarten, Größen, weißen und hellgrauen Farbtönen, hauchen den Flocken einen realistischen Effekt ein.

Jedes einzelne Flöckchen erhält seine eigenen Attribute und wird als Variable in ein Array verfrachtet. In einer Endlosschleife werden die Variablen als zufällige Elemente (Math.random) übergeben. Mit der Eigenschaft "max_size" wird die Flockendichte bestimmt. In einer Zeit-Funktion "init_time und window.setTimeout" wird noch die Fallgeschwindigkeit definiert.

Schönheitskur mit CSS3
Häufig unterstreichen Betreiber von Webseiten zur Weihnachtszeit ihre Kundennähe mit Weihnachtsgrüßen. Leichter Schneefall würde hier das winterliche Flair besonders passend hervorheben. Ebenso könnten ein paar herunterrieselnde Schneeflocken so manchen Online-Adventskalender ein gelungenes Aussehen verleihen. Optik und Positionierung könnten mit CSS noch erheblich aufpoliert werden. Mit CSS3 sind dem Webdesigner keine Grenzen gesetzt.

Professionelle Schnee-Animation
Wer sich nicht selbst mit JavaScript herumplagen will, aber unbedingt ein Schneetreiben in seine Webseite einbinden möchte, kann sich einer professionellen Anwendung bedienen. Ohne meine Arbeit unter den Scheffel zu stellen, muss ich zugeben, dieses Anwendung bietet einen weitaus größeren Umfang an Features, als meine hier vorgestellte Version. Knapp 30,- Euro kostet dieses Meisterwerk von [ schnee-animation.de ] und es ist jeden Cent wert.

Für den Betrieb unserer Webseite nutzen wir Cookies. Bei Ablehnung, stehen möglicherweise nicht mehr alle Funktionalitäten der Seite zur Verfügung.