Proper Touch Button Behavior For MobileSafari

MobileSafari as a rule has incorrect HTML button behavior (incorrect meaning: 'not like an iOS native button'). Correct button behavior is as follows: User touches button: Button

Solution 1:

Basically what you'd want to do is build out some sort of hybrid hover functionality for touch devices, which detects when your finger moves in/out of the button in question.

I built a basic JSFiddle which implements some barebones functionality. If you know any javascript, I think you'll get the idea.

Live JSFiddle DEMO

Try it on your iOS device (and maybe your Android device??).

- brian