title: How to apply a motion-blur in javascript/jquery?
body: <p>I'm wondering how to make a motion blur in javascript/jquery. I've an horizontal gallery and I want to apply the motion blur when the images are moving. Actually, It works perfectly with that way :  an overlay image with a motion blur (photoshop) and the opacity varies depending to the speed of the images.
  The render looks pretty good but i need to load 2 times all my images and it sucks.
  In html :</p>
  
  <pre><code>&lt;div id="slider wrapper"&gt;
    &lt;ul&gt;
      &lt;li&gt;
        &lt;a href=""&gt;
          &lt;img src="img1.jpg"/&gt;
          &lt;img src="img1_blur.jpg"/&gt;
        &lt;/a&gt;
      &lt;/li&gt;
      &lt;li&gt;
        &lt;a href=""&gt;
          &lt;img src="img2.jpg"/&gt;
          &lt;img src="img2_blur.jpg"/&gt;
        &lt;/a&gt;
      &lt;/li&gt;
      &lt;li&gt;
        &lt;a href=""&gt;
          &lt;img src="img2.jpg"/&gt;
          &lt;img src="img2_blur.jpg"/&gt;
        &lt;/a&gt;
      &lt;/li&gt;
  &lt;/div&gt;
  </code></pre>