Tuesday, October 22, 2013

Mouseenter, mouseout on tablets

My website looked cool with its mouseenter and mouseleave events being fired as the cursor sped across the screen, until I tried it on an iPad. Mouseenter was simulated by tapping, and a double-tap opened the link like it was supposed to, but the mouseout event wasn't firing at all, so that tapping on another link didn't clear the state of the first link. So the program logic was broken. How to fix this I had no idea. Googling it just came up with opinions saying that basically there was nothing you could do. Come on! There's always something you can do. Mouseenter works fine via tap. Then all you have to do is refactor your code so that it doesn't need mouseout to work. So on mouseenter just test if there is already a highlighted link and if so, do the mouseout stuff. But keep the mouseout function because mice are still numerous in this laptop/tablet/phone world in which we all live.

Also remember that fingers are a lot less sharp than pointy cursors. Things to click on need to be of a good size. Tablet users are a bit like babies: they need big fat bightly coloured things to touch.

No comments:

Post a Comment