Bücher online kostenlos Kostenlos Online Lesen
HTML5-Handbuch - die neuen Features von HTML5

HTML5-Handbuch - die neuen Features von HTML5

Titel: HTML5-Handbuch - die neuen Features von HTML5 Kostenlos Bücher Online Lesen
Autoren: Franzis
Vom Netzwerk:
der
id
-Name des Submit-Buttons (
submitbutton
) des Formulars.
    Wenn ein
menuitem
-Element ein
command
-Attribut enthält, darf es übrigens keine weiteren Attribute enthalten. Der Menütext ergibt sich aus der Beschriftung oder dem Elementinhalt des Elements, auf das der
command
-Eintrag verweist. Im Beispiel »erbt« das
menuitem
-Element als sichtbares Label also den Wert »Übernehmen«, da dies der sichtbare Wert des Submit-Buttons ist, auf den verwiesen wird.
Weitere Hinweise
    Das
menu
-Element sollte nicht für normale Website-Navigationen verwendet werden. Realisieren Sie solche Navigationen mit dem
nav
-Element und ungeordneten Listen (mehr dazu in 4.1.4 Navigation und Seitenleisten). Die Einträge eines
menu
-Menüs sollten stets Aktionen auslösen und deshalb in der Regel entsprechende Event-Handler mit zugewiesenem JavaScript-Code enthalten.
Zum Redaktionszeitpunkt existierte noch keine vernünftige Browser-Umsetzung der neuen HTML5-Erweiterungen zu
menu
. Das
menuitem
-Element bleibt in Browsern, die das Element nicht kennen, vollständig unsichtbar, da es ein Standalone-Element ohne Inhalt ist. Es wird deshalb noch dauern, bis diese Möglichkeiten bedenkenlos und ohne zusätzliche Workarounds eingesetzt werden können.
Referenzinformationen
    Elementreferenz

,
    Elementreferenz

:

    Attributreferenz
type
,
    Attributreferenz
label
,
    Attributreferenz
radiogroup
,
    Attributreferenz
command
,
    Attributreferenz
icon
,
    Attributreferenz
contextmenu
:

8.6.2      Aufklappbare Details
    Zu viel Information oder zu viele Bedienelemente gleichzeitig wirken erschlagend und verwirrend auf Anwender. In manchen Fällen ist es deshalb sinnvoll, vollständige Inhalte nur auf explizite Anforderung des Anwenders hin anzuzeigen. Lösbar war diese Aufgabe schon seit Langem, jedoch erforderte sie Scripting.
HTML5 führt eine Möglichkeit ein, aufklappbare Details direkt in HTML zu definieren.
Beispiel
    

    Übungen zu Kapitel 1
    
    

    

    Übungen zu Kapitel 2
    
    

Erläuterung
    Mit



markieren Sie einen Bereich, der aus einem immer angezeigten, durch Anklicken aufklappbaren Inhalt besteht. Der immer angezeigte, anklickbare Inhalt wird im unmittelbaren Anschluss an das einleitende

-Element mit



markiert. Der restliche Inhalt des
details
-Elements wird nur angezeigt, wenn er sich im aufgeklappten Zustand befindet. Das
summary
-Element verhält sich als Toggle-Element. Ein Klick öffnet den Inhalt, der nächste Klick schließt ihn wieder, der übernächste öffnet ihn wieder usw.
    Im obigen Beispiel sind also die Texte
Übungen zu Kapitel 1
und
Übungen zu Kapitel 2
immer sichtbar. Beim Anklicken werden die Verweislisten unterhalb davon eingeblendet oder wieder ausgeblendet.
    Bild 8.22: Geöffnetes und geschlossenes
detail
-Element im Browser
Weitere Hinweise
    Web-Browser sollten den Inhalt des
summary
-Elements sichtbar als aufklappbar visualisieren, beispielsweise durch einen vorangestellten Pfeil. Zum Redaktionszeitpunkt gab es jedoch noch keinen Browser, außer Google Chrome, der die Aufklappfunktionalität von
details
und
summary
implementiert hat.
    Überschriften innerhalb des
details
-Elements fließen nicht in die dokumentglobale Überschriftenhierarchie (Outlining) mit ein.
Referenzinformationen
    Elementreferenz

,
    Elementreferenz

:

8.6.3      Dialogelemente
HTML5 wird vor allem als Basissprache für die Entwicklung von Webanwendungen weiter ausgebaut. Zu interaktiven Anwendungen gehören typischerweise auch Elemente wie Dialogboxen oder On-the-fly-Popups wie etwa ein Monatskalender zur Auswahl eines Datums.
    Gegenwärtig sind solche interaktiven Elemente zwar bereits auf vielen Websites im Einsatz, doch werden sie HTML-seitig bislang fast ausschließlich mit Hilfe von
div
-Elementen realisiert. HTML5 spendiert jedoch ein eigenes Element dafür.
Beispiel