Informationen
Das angeforderte Thema wird unten angezeigt. Es ist jedoch nicht in dieser Bibliothek vorhanden.

So wird's gemacht: Simulieren von "Zeigen" auf Geräten, die die Fingereingabe unterstützen

Das zeigen mit dem Cursor auf ein Webseitenelement wird sehr häufig durchgeführt, wenn ein Benutzer mit einer Maus und der Tastatur arbeitet, beim Browsen per Fingereingabe gibt es dafür jedoch kein Äquivalent. In diesem Thema wird beschrieben, wie Sie die aria-haspopup Dokumentobjektmodell (DOM)-Eigenschaft zum Simulieren des Zeigens auf Geräten mit Windows Internet Explorer 10 unter Windows 8 verwenden, die die Fingereingabe unterstützen.

Hinweis  Dieses Verhalten gilt nicht für Internet Explorer 10 unter Windows 7 (hier gibt es keine Daraufzeigen-Simulation mit aria-haspopup) oder für Internet Explorer 11 unter Windows 8.1 (verfügt über eine integrierte Unterstützung von Daraufzeigen per Toucheingabe).

Im Internet werden interaktive Inhalte häufig erst durch das darüber Bewegen der Maus erkennbar. So kann ein Benutzer z. B. mit der Maus auf ein Element zeigen, um damit ein darunter liegendes Menü anzuzeigen. Das Zeigen wird entweder mit der CSS-Pseudoklasse :hover (Cascading Stylesheets) oder dem DOM-Ereignis onmouseover aktiviert.

Bei der Fingereingabe erfolgt das Zeigen auf ein Element, wenn es berührt wird. Durch das Tippen auf ein Element kann dieses aber auch aktiviert werden, bei einem Link erfolgt z. B. eine Navigation. Daher ist das Tippen sowohl Zeigen als auch Aktivieren in einer Aktion. Deshalb sind Inhalte, die erst durch Zeigen sichtbar werden, für die Fingereingabe nicht verwendbar. Das Interaktionsmodell unterscheidet sich grundlegend, daher gibt es keine Entsprechung für das Zeigen mit dem Cursor auf ein Seitenelement.

Es wird daher empfohlen, Zeigen nicht für das Ausblenden von Inhalten zu verwenden, mit denen Benutzer interagieren können. Verwenden Sie stattdessen lieber das onclick-Ereignis, um Elemente ein- und auszublenden.

Internet Explorer 10 stellt für die bereits vorhandene aria-haspopup-Eigenschaft aber auch noch ein neues Verhalten bereit, um das Zeigen auf Seitenelemente zu simulieren.

Legen Sie für ein Seitenelement mit Daraufzeigen-Verhalten zum Steuern der Sichtbarkeit von interaktivem Inhalt die aria-haspopup-Eigenschaft des Elements auf "true" fest:


<style>
#hovermenu li ul {
 display: none;
}
#hovermenu li:hover ul{
 display: block;
}
</style>
<ul id="hovermenu">
	<li><a href="/news/" aria-haspopup="true">News Categories</a>
		<ul>
			<li><a href="/news/top">Top Stories</a></li>
			<li><a href="/news/technology">Technology</a></li>
			<li><a href="/news/sports">Sports</a></li>
			<li><a href="/news/finance">Finance</a></li>
		<ul>
	</li>
</ul>


Wenn ein Benutzer auf einem Gerät mit Toucheingabe in Internet Explorer 10 zum ersten Mal auf das Seitenelement tippt, entspricht die Reaktion dem Verhalten beim Daraufzeigen mit der Maus. Das Element bleibt so lange in diesem Zustand, bis der Benutzer auf eine andere Stelle auf der Seite oder erneut auf das Element tippt oder zu einer anderen Seite navigiert. Die Standardaktionen des onclick-Ereignisses (z. B. die Navigation bei einem Link) werden beim ersten Tippen auf das Element nicht ausgeführt.

Durch das Aktivieren der aria-haspopup-Eigenschaft ändern Sie nicht das Verhalten Ihrer Webseite für Benutzer, die Maus und Tastatur verwenden. Außerdem hat die Verwendung der aria-haspopup-Eigenschaft für diesen Zweck keine Auswirkungen auf ihre Verwendung als ARIA-Eigenschaft (Accessible Rich Internet Applications).

Verwandte Themen

Internet Explorer 10: Handbuch für Entwickler

 

 

Anzeigen:
© 2014 Microsoft