I came across a problem recently that to some degree or other seems to involve the following players in concert:
- Apple IOS 8.x.x
- CSS3 Animations
- CSS3 Transitions (maybe)
While developing the website, I was viewing it on an iPad4 with IOS 7.x.x. I had no problems. When complete, I asked a few friends to take a look and several of them said they received the Title name as an error. Namely, ‘A Problem Occurred With This Webpage So It Was Reloaded’. The page had broken and would not render whatsoever. One of the friends forwarded me a screenshot and it also read, ‘A problem repeatedly occurred on “http://mywebsite.com”‘.
I started doing some googling for the error message and found the following: http://joelglovier.com/writing/solution-for-css-transitions-crashing-safari/. Joel notes the problem as being related to transitions. I could not replicate his findings. But I DID find issue with CSS3 Animations.
I removed all of the animations in my css file and refreshed the page. It now worked in Safari on IOS 8.x.x. So one-by-one I began adding back in the animations and keyframes until things broke down. It seemed when I called two separate @-webkit-keyframes on the same page, it was breaking down on me. Of course, ultimately I removed one and no problems now.
I post this in hopes that someone else may benefit in some way from the findings when they get stuck with this crappy ‘A Problem Occurred With This Webpage So It Was Reloaded’ bug of IOS 8.x.x. As an aside, Apple, get this fixed please. It’s really annoying.