title: Start javascript animation after an image has loaded
body: <p>I'm looking for a way to initiate a text animation after a background image has loaded. Specifically, the h1 element should animate after the div#image-bg has loaded it's background image. I'm using <a href="https://github.com/matthieua/WOW" rel="nofollow">wow.js</a> to animate objects and the developer's intention was to initiate movement on scroll. To see the full site where the issue exists, it's all at abbyaker.com.</p>
  
  <h2>Here's a stripped version of my html page:</h2>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
      &lt;link rel="stylesheet" href="css/style.css"&gt;
      &lt;link rel="stylesheet" href="css/animate.css"&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div id="container"&gt;
      &lt;!-- - - - - - - - - - - - - - Intro - - - - - - - - - - - - - --&gt;
          &lt;div id="headwrap"&gt;
              &lt;div id="image-bg"&gt;&lt;/div&gt;
              &lt;div id="intro"&gt;
                  &lt;h1 class="white wow fadeInUp" data-wow-duration="700ms" data-wow-delay="400ms"&gt;Hello&lt;/h1&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;script src="js/wow.min.js"&gt;&lt;/script&gt;
      &lt;script&gt;
       new WOW().init();
      &lt;/script&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p></p>
  
  <p>Your help is appreciated!</p>