Skip navigation
Currently Being Moderated

HTML Animation reload at page view?

Jul 25, 2011 7:35 PM

Regarding this tutorial on HTML5 animations for iPad:
http://digitalpublishing.tumblr.com/post/3898796141/animate-headlines- or-other-things

Could anyone please tell me how to make the animation restart everytime the page is viewed? At the moment it plays once (works great) but only once, if you return to the page the animation will still be where it finished at last keyframe… I want it to run everytime page is viewed… I have a deadline end of week so any help asap would be appreciated! thanks :S

 
Replies
  • Currently Being Moderated
    Aug 1, 2011 2:34 PM   in reply to warnervillage

    Very interesting problem!

     

    For me the problem only happens in Safari and Safari Mobile (not in Chrome). Is that is the case for you as well?

     

    Additionally, this problem only happens for me when using the back button and then the forward button. If I use the back button and then click the link to the animation again (i.e. no forward button) the problem does not occur. Is that is the case for you as well?

     

    What I found was that when doing a back/forward our jQuery ready function was not called. I thought this was a caching problem and experiemented with tags to disable caching but that didn't help at all.



    Then I ran into the article http://stackoverflow.com/questions/158319/cross-browser-onload-event-a nd-the-back-button which has a great discussion about special back/forward caches in browsers.



    By adding:



    $(window).unload(function(){});



    in the .js file associated with the Wallaby .html file, or changing the  tag in the Wallaby .html to:



     

     

    The problem you described seems fixed as either one of these modifications ends up disabling the back/forward cache.

     

    We will modify our output to handle this in a future release. In the meantime, users will need to add this themselves.

     

    I'll create a new top level forum topic covering this so that more Wallaby users are likely to find this important information.

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points