Website repeatedly reloads, then crashes on iPhone 4: iOS 8.0.2 & iOS 8.1.2 -

an example of happens when loading website can seen here theverge.com. no such problems occur on latest browser , os versions for:

• windows 8.1 - chrome, firefox, opera, ie.
• osx yosemite - chrome, safari.
• android 4.4 - chrome, firefox, opera, safari.
• ios 7.1.2(ipad) - safari.
• ios 8.3 (iphone 5) - safari.

however, on 2 separate iphone 4s devices (ios 8.0.2 & ios 8.1.2), safari continue refresh page, each time reading "problem occurred webpage reloaded" until crashing , reading "a problem repeatedly occurred on [website url]". have made sure javascript/jquery syntactically correct (as loading webpage javascript turned off in safari settings - same problem), cleared cache, restarted iphones , can not imagine else causing problem. web page small total file size of around 300kb , simple dom manipulation.

from can tell of own testing , have read, problem isolated ios 8.0.2 , 8.1.2 obviously, website in minority of sites crash on os , know causes problem.

thank you.

edit: updated 1 of iphones ios 8.3 - problem still persists. absolutely stumped @ point , suggestions appreciated.

short answer:

check of css animation keyframes , remove font-size animations within blocks.

long answer

the lack of developer-centric conversations regarding "a problem repeatedly occurred on..." issues disappointing. after hour of googling tonight stumbled on post here , had double-take when saw timestamp. // high 5 fellow trouble-shooter.

as luck have it, able track down potential source ios/webkit bug within css. seems related how safari deals font-size animations inside of css keyframes. had in sass:

@-webkit-keyframes labels-bottom {     0%   { opacity: 1; color:#888888; top: 0.1em; font-size: 1.5em; }     20%  { font-size: 1.5em; opacity: 0; }     30%  { top: 0.1em; }     50%  { opacity: 0; font-size: 0.85em; }     100% { top: 4em; opacity: 1; } } 

when removed whole block, began working.

when went further , removed css properties one-by-one, crash seemed isolated font-size animation. it, however, does not appear associated @font-face web fonts or if specify size using different units (em/px/pt). conditions tested caused same crash. thing fixed removing font-size changes within keyframe blocks, la:

@-webkit-keyframes labels-bottom {     0%   { opacity: 1; color:#888888; top: 0.1em; }     20%  { opacity: 0; }     30%  { top: 0.1em; }     50%  { opacity: 0; }     100% { top: 4em; opacity: 1; } } 

it's possible (and perhaps likely) other animated properties can trigger crash, fix worked me , hope well.

ps: tested on both ios 8.1.2 , 8.3 (ipads).