Überhaupt hat der Fortschritt das an sich, dass er viel größer ausschaut, als er ist. – Johann Nepomuk Nestroy

Kapitel 17 DHTML und CSS

Allein die Erwähnung des Begriffs DHTML lässt die Augen von vielen Leuten im Web-Bereich leuchten und steigert die Auflage von vielen Zeitschriften. Doch was ist DHTML überhaupt? Die Abkürzung steht für Dynamic HTML – doch handelt es sich hierbei um eine HTML-Erweiterung oder nur um neue JavaScript-Befehle? Wenn Sie in der Marketingabteilung einer Web-Agentur nachfragen, bekommen Sie mit ziemlicher Sicherheit eine weitläufige Erklärung, die diese Technik wahlweise als »Stein der Weisen« oder als »Ei des Kolumbus« preist. Das Ziel dieses Kapitels soll es sein, dass Sie ein Gefühl dafür bekommen, was man mit DHTML machen kann. Eine vollständige Abhandlung des Themas, inklusive einer Auflistung aller Bugs werden Sie hier schon allein aus Platzgründen nicht finden.

In diesem Kapitel wird das Thema DHTML kurz allgemein beleuchtet, und dann werfen wir einen Blick auf die beiden »großen« Browsergruppen: aktuelle Mozilla-Browser und natürlich den Internet Explorer. Safari, Konqueror und Opera halten sich meist an die Mozilla-Implementierung und werden deswegen nicht gesondert aufgeführt.

Explizit nicht behandelt werden Anno-Tobak-Versionen von Browsern. Sowohl der Internet Explorer 4 als auch der Netscape Navigator 4 konnten DHTML, leider komplett unterschiedlich und zueinander inkompatibel. Die Zugriffsweise des Internet Explorer 4 ist in neueren Versionen des Internet Explorer zwar immer noch präsent, wird aber in der Regel nur noch dazu verwendet, die Browser voneinander zu unterscheiden. Und Mozilla-Browser haben sich immerhin einige Elemente des DHTML-Supports von Netscape abgeguckt.

17.1 Grundlagen 

Wie schon in der Einleitung angedeutet wurde, ist es nicht immer ganz leicht zu verstehen, was mit DHTML gemeint ist. In diesem Abschnitt unternehme ich den Versuch, den Begriff zu bestimmen und die notwendigen (theoretischen) Hintergründe zu erläutern. Außerdem werden die entsprechenden HTML-Tags vorgestellt.

Was ist DHTML? Jeder Entwickler und jeder Browserhersteller hat eine andere Definition parat. Da ist von viel Dynamik die Rede und von der Erfüllung aller Träume von Webentwicklern. Ich bevorzuge dagegen eine etwas einfachere, flapsigere Definition: »DHTML ist JavaScript für Browser ab Version 4« (wobei beispielsweise der Mozilla-Browser die Versionsnummer 6, 7 oder 8 hat – schließlich ist er der Netscape-Nachfolger). Diese Definition ist eine Art kleinster gemeinsamer Nenner aller konkurrierenden Beschreibungen. Aber das »D« für »Dynamic« hat schon seine Berechtigung. Mit den bisher vorgestellten JavaScript-Techniken kann man zwar auf gewisse Weise auf Benutzereingaben reagieren, aber man hat nicht viele Zugriffsmöglichkeiten auf die Elemente einer HTML-Seite. Zwar kann man mit dem Image-Objekt Grafiken austauschen, von einer Größenveränderung oder gar Verschiebung kann aber keine Rede sein. Mit DHTML ist das möglich, es ist sogar eine Art von Drag&Drop möglich.