Uso della proprietà aria-haspopup per simulare il passaggio del mouse sui dispositivi abilitati al tocco

Passare con il cursore del mouse su un elemento di una pagina Web è un'azione comune durante l'esplorazione con mouse e tastiera. Non esiste però un'azione equivalente utilizzabile per l'esplorazione basata sul tocco. In Internet Explorer 10 in Windows 8 viene introdotto un nuovo utilizzo della proprietà Document Object Model (DOM) aria-haspopup per simulare il passaggio del mouse su dispositivi abilitati per il tocco.

Nota  Questo comportamento non è applicabile a Internet Explorer 10 in Windows 7.

Uno schema comune usato per il Web consiste nel nascondere il contenuto interattivo in modo che sia visibile al passaggio del mouse. Quando ad esempio un utente posiziona il puntatore del mouse su un elemento, viene visualizzato un menu. La visualizzazione di contenuto al passaggio del mouse viene in genere abilitata tramite la pseudoclasse CSS :hover  o l'evento DOM onmouseover .

Negli scenari basati sul tocco il passaggio del mouse viene applicato mentre si tocca un elemento. Il tocco può tuttavia anche attivare un elemento, ad esempio il passaggio alla pagina associata a un link. In realtà, il tocco implica due operazioni in una, il passaggio del mouse e l'attivazione. In questo modo, il contenuto interattivo nascosto dietro il passaggio del mouse non è accessibile agli utenti di dispositivi abilitati al tocco. Il modello di interazione è completamente diverso e nei dispositivi abilitati al tocco non esiste un'azione equivalente al passaggio del cursore su un elemento di una pagina.

Ti consigliamo quindi di non nascondere contenuti con cui l'utente può interagire al passaggio del mouse. Usa invece l'evento onclick per attivare o disattivare la visibilità.

In alternativa, puoi usare un nuovo comportamento aggiunto alla proprietà aria-haspopup esistente in Internet Explorer 10 proprio per simulare il passaggio del mouse su elementi della pagina con contenuti interattivi nascosti.

In un elemento della pagina, ad esempio un menu, impostare la proprietà aria-haspopup dell'elemento su "true". Quando un utente di un dispositivo abilitato per il tocco tocca l'elemento della pagina in Internet Explorer 10, l'esperienza utente sarà uguale a quella di un utente che passa con il cursore del mouse sull'elemento. L'elemento rimarrà in questo stato fino a quando l'utente non tocca un altro punto nella pagina, non tocca di nuovo l'elemento o passa a un'altra pagina. Le azioni predefinite dell'evento onclick, ad esempio l'apertura di una pagina associata a un link, non vengono inoltre eseguite al primo tocco sull'elemento della pagina.

L'abilitazione della proprietà aria-haspopup non implica la modifica del comportamento della pagina Web per i visitatori che usano mouse e tastiera. Se usata per questo scopo, la proprietà aria-haspopup può comunque essere usata anche come proprietà ARIA (Accessible Rich Internet Applications).

Argomenti correlati

DOM
Guida di Internet Explorer 10 per sviluppatori

 

 

Mostra:
© 2014 Microsoft