title: HTML5 animation - play when scrolled to
body: <p>I want to have a few HTML5 animations on one page but don't want them all to play at once/when the page loads. Instead I'd like for each animation to auto-play when a user scrolls to the section where each animation is. What is the appropriate tag, code, etc. to make that happen?</p>
  
  <p>A couple of examples elsewhere:
  nest.com/living-with-nest/
  - When you scroll down to day 2 the blue and orange arrows animate in</p>
  
  <p>apple.com/ipad/features/
  - When you scroll down to the camera section, the lens video/vr plays
  - Same with the Smart Cover, Airplay and other sections</p>
  
  <p>Thanks!</p>