title: Bootstrap-carousel lazy loader
body: <p>I have got the bootstrap carousel working on my web page and i want it to lazy load.
  I have found this piece of code on the internet:</p>
  
  <pre><code>$("#myCarousel").bind("slid", function(){
      $img = $(".active img", this);
      $img.attr("src", $img.data('lazy-load-src'));
  });
  </code></pre>
  
  <p>This causes the carousel to "load" the current image when the next button (or prev) button is clicked. I want it to load not the current image but the image after that, and the image in front of the current image, so that i still have the nice sliding animation. And not a loading image.</p>
  
  <p>So my question is how do I set the lazy-load-src to src of the previous image and of the next image when the next button is clicked?</p>