The solution to this turned out to be a lot more painful then I originally had hoped. CSS overflow seems to work a little different on an iPhone vs desktop Safari and Firefox. Below is a link to my solution.
The animation is setup using CSS3 transitions. I then add or remove classes to kick off the animation. There are some weird things I had to do like turn on/off overflow for the container div and scroll to the top on the secondary screen.
It seems pretty messy so if anyone has a better solution then send me a twitter message.
After a lot more testing I’ll probably roll this into Disc Golf ScoreCard 2.5.2.
Open this link on an iPhone or Android 4 device:
