Windowsタブレットでのhoverメニュー対応

WindowsタブレットでIEを使うと、タッチの扱いが半端で、
タッチしてもマウスのイベントが駆動します。
Chromeだとタッチイベントが起こるんですが、IEはダメです。
どういう概念で設計してんのか責任者に問いたい感じです。

ってことで、本題なんですが、
メニューなどで、マウスオーバーでサブメニューをピローンと出すことは多々あると思います。
そんな時はWindowsタブレットでは、メニューをタッチすると、
mouseenterが起こったと思いきやmouseoutが発生し、
一瞬にしてメニューが隠れます。(アホかっ)

解決策は、
aria-haspopup="true"
上記コードを親というか、トリガーとなる要素に属性として付与する事です。
すると、タッチ時にホバー継続動作のエミュレーションが行われ、
マウスオーバーで想定してた動作が行われます。
気持ち悪い事この上ない実装乙。

タッチ対応デバイスでホバーをシミュレートする方法 / MSDN

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です