title: Animation of google markers on map load with timeout
body: <p>I would like to create a timeout on each google marker's DROP animation, but I think the closure code for the marker and the array item are conflicting. I do not know too much about closures and am getting a bit stuck on the problem.</p>
  
  <p>I can get them all falling at once.</p>
  
  <p><a href="http://jsfiddle.net/Dj7vH/" rel="nofollow">falling markers code jsfiddle</a></p>
  
  <p>but I would like to have a timeout after every marker of 100 ms. </p>
  
  <p>This is what I thought would work</p>
  
  <pre><code>...
  
  //Loop through nc array
  for (var i = 0; i &lt; nc.length; i++) {
  
     //Create 100 ms rule on marker creation
     setTimeout(function () {
  
       //Create marker
       var marker = new google.maps.Marker({
         position: nc[i],
         map: map,
         title: "tron" + i,
         animation: google.maps.Animation.DROP,
       });
  
      }, i * 100);
  
     //Creating the closure
     (function (i, marker) {
  
       //Add infowindow
       google.maps.event.addListener(marker, 'click', function () {
           if (!infowindow) {
              infowindow = new google.maps.InfoWindow();
           }
           //Setting content of info window
           infowindow.setContent('&lt;h2&gt;Tron lives | ' + i + '&lt;/h2&gt;');
               infowindow.open(map, marker);
           });
        })(i, marker);
      };
  
  ...
  </code></pre>
  
  <p>But that does not work. I figure that once the markers are created in the loop one would set the timeout on that creation process which would create the falling rain marker effect.</p>