title: jquery image preview that work on ajax embedded image links?
body: <p>there are various good jquery image preview plugins out there. however, all of the ones i've tested havent worked on image links that are embedded in the DOM with ajax.</p>
  
  <p>i have tested use jquery live feature, but it doesnt work flawless.</p>
  
  <pre><code>$('a.preview').live('mouseover', function() {
      $(this).imgPreview({
          imgCSS: {
              //width: '200px'
          },
          preloadImages:      'true',
      });
  });
  </code></pre>
  
  <p>im using this one: <a href="http://www.webresourcesdepot.com/jquery-image-preview-plugin-imgpreview/" rel="nofollow noreferrer">http://www.webresourcesdepot.com/jquery-image-preview-plugin-imgpreview/</a></p>
  
  <p>the problem is that i have to use jquery live as u see above. but there is 2 flaws.</p>
  
  <ol>
  <li><p>if i move the mouse over the thumbnail the first time it doesnt show the preview, i guess that is because i hasnt fetched the image yet. so i have to move the mouse away from the image and back over the image again, then it'll be shown. and that is very annoying.</p></li>
  <li><p>it doesnt preload the images. if you check on their website they are using it like this instead:</p>
  
  <p>$('a.preview').imgPreview({
          preloadImages:      'true',
  });</p></li>
  </ol>
  
  <p>and that will preload all previews after DOM is fully loaded. but i have encapsulated the function. but even if i didnt, it cant cause i add these image links with ajax AFTER DOM is loaded.</p>
  
  <p>i wonder if someone knows about a plugin that could do same stuff on ajax-loaded elements, both preview and preload.</p>
  
  <p>thanks.</p>