javascript animation halted in ios safari webkit browser when finger is on the screen without lifting

Question

i have a webview, that is being show in an app there is an animation on the page, a digital timer, where i am showing the images of each digit like so 00:39, 29:39, etc

it is being animated use setInterval in javascript within the page problem is that when i put my finger on the screen, ie a touch without lifting my finger the browser halts, meaning the animation no longer animates, it stops at the place when my finger touch the screen , and it will continue animate after i lift my finger

how can i fix this? i heard that i can use prevent default method, but wouldn't that ignore all my events on the page?

basicaly besides the timer in my webpage, i also have some stuff that user can interact with , so it is looking for the click event etc.

so i definitely want to keep that as well please help

this happens on ios device...if i run in desktop brower, everything seems ok..not halting being observed

Answer 1

Just for anyone that comes across this later: Animations always halt in web browsers when scrolling , which is what your web view is anticipating by the finger touch. This will happen on desktop browsers as well .

Answer 2

Does it halt if you press anywhere or only on the counter? Try preventing clicks on the counter element. Eg..

$('#counter-container').click(function()
{
  e.preventDefault();

  return false;
});

Edit: Apparently this isn't an uncommon issue. When the iphone needs more CPU/Memory resources, it will halt execution of javascript. Look into using setInterval (executes javascript at a given interval until clearInterval() is called) to detect if an animation didn't complete successfully.
Related questions:
User interaction sometimes screws up jQuery ajax requests in UIWebView
AJAX constantly look for server update? Javascript
https://discussions.apple.com/thread/2723866?start=0&tstart=0

Answer 3

found what the issue is. it has nothing to do with ajax request or the cpu it is because a tiny scrolling was introduced. apparently all the ainmation will be put on halt if you are scrolling or going to scroll.