マウスオーバーをタッチパネル対応に・・・
前回の記事の続きで、
<a>にマウスオーバーした時にmouseenterイベントで近くに<iframe>(画像)をポップアップする感じなのだが、
クリックした場合はポップアップをオン/オフ切り替えができるようにしてた。
つまり、ポップアップがオン/オフする条件が、
mouseenter → mouseleave
click → click
の2通りでこの3つを addEventListener してた。
だが、タッチパネルの時にclickよりも先にmouseenterが発動してしまうようで、タッチが終わると即オフになっちゃう。
というわけだったが、
mouseleaveイベントはmouseenter発生後にaddEventListenerして、
もう1個touchstartを設定してtouchstart発生時はmouseenterをremoveEventListenerする。
touchstartではremoveEventListenerだけして、ポップアップは続くclickで処理する。
って感じが良さそう。
touchstartはタッチパネルなら一番最初に発生すると思われる。