Informations
Le sujet que vous avez demandé est indiqué ci-dessous. Toutefois, ce sujet ne figure pas dans la bibliothèque.

Comment simuler le pointage sur des appareils tactiles

Le pointage de votre curseur sur un élément de page Web est une action courante quand vous naviguez à l’aide d’une souris ou d’un clavier, mais elle est sans équivalent quand la navigation est tactile. Cette rubrique montre comment utiliser la propriété DOM (Document Object Model) aria-haspopup pour simuler le pointage sur des appareils tactiles avec Internet Explorer 10 sur Windows 8.

Remarque  Ce comportement ne s’applique pas à Internet Explorer 10 sur Windows 7 (qui ne prend pas en charge la simulation du pointage avec aria-haspopup) ou à Internet Explorer 11 sur Windows 8.1 (qui intègre la prise en charge du pointage tactile).

Sur le Web, il est courant de masquer du contenu interactif derrière un pointage de souris. Par exemple, un utilisateur peut pointer sur un élément avec une souris et un menu s’affiche en dessous. Le pointage est généralement activé en utilisant la pseudo-classe CSS (Cascading Style Sheets) :hover  ou l’événement DOM onmouseover .

Dans les scénarios tactiles, le pointage est appliqué à un élément quand ce dernier est touché. Toutefois, le fait d’appuyer sur un élément peut également activer cet élément, par exemple quand vous effectuez une navigation à l’aide d’un lien. Quand vous appuyez sur un élément, cela correspond en fait à pointer sur cet élément et à l’activer en une seule action. C’est pourquoi le contenu interactif masqué derrière un pointage est inaccessible pour les utilisateurs interactifs. Le modèle d’interaction est complètement différent et il n’existe aucun équivalent tactile au pointage du curseur sur un élément de page.

La meilleure pratique consiste à ne pas utiliser le pointage pour masquer du contenu avec lequel l’utilisateur peut interagir. Envisagez plutôt d’utiliser l’événement onclick pour afficher/masquer ce contenu.

Internet Explorer 10 ajoute également un nouveau comportement à la propriété aria-haspopup existante pour simuler le pointage sur des éléments de page ayant un contenu interactif masqué.

Dans un élément de page qui a un comportement de pointage qui fait basculer la visibilité du contenu interactif, définissez la propriété aria-haspopup de l’élément à "true" :


<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>


Quand un utilisateur doté d’un appareil tactile exécutant Internet Explorer 10 appuie pour la première fois sur l’élément de page, l’expérience utilisateur est identique à celle d’un utilisateur qui pointe sur l’élément avec un curseur. Tant que l’utilisateur n’appuie pas ailleurs sur la page, n’appuie pas à nouveau sur l’élément ou n’accède pas à une autre page, l’élément conserve son état de pointage. De plus, les actions par défaut de l’événement onclick (telle que la navigation d’un lien) ne sont pas effectuées quand l’utilisateur appuie pour la première fois sur l’élément de page.

L’activation de la propriété aria-haspopup ne change pas le comportement de votre page Web pour les visiteurs utilisant une souris ou un clavier. De plus, l’utilisation de la propriété aria-haspopup dans ce sens n’affecte pas son utilisation en tant que propriété ARIA (Accessible Rich Internet Applications).

Rubriques connexes

Guide du développeur Internet Explorer 10

 

 

Afficher:
© 2014 Microsoft