Inline-Tooltips mit Popover

Popovers sind überall im Web zu finden. Man sieht sie in Menüs, Infobox, die zusätzliche Informationen enthält. und Dialogen, die sich als Kontoeinstellungen, Offenlegungs-Widgets und Warenkorbvorschauen manifestieren können.

Obwohl diese Komponenten weit verbreitet sind, war ihre Erstellung in Browsern bisher überraschend kompliziert. Sie müssen neben der Kernfunktionalität Ihres Element, das in der obersten Ebene aufplobbt. Skripte hinzufügen, um Fokus sowie Öffnungs- und Schließzustand mit Maus, Tastatur und Touchgeräten zu verwalten. Die W3C Community Group, die sich die Verbesserung des Web auf die Fahnen geschrieben hat. hat es sich zur Aufgabe gemacht, für solche UI-Elemente optimierte Modelle zu entwerfen und diese zur Standardisierung einzureichen.

Das Tutorial zeigt, wie Sie mit der neuen Neuer Standard der WHATWG schnell und einfach Tooltipps und Popups erstellen, die diese Funktionalitäten bereits browserseitig mitbringen. Es ist kein kompliziertes CSS oder gar JavaScript nötig!