title: html 5 video thumb gallery with jQuery
body: <p>I have been trying to alter my code from image thumbnail gallery to a video thumbnail gallery. I have the videos encoded in the various formats for html 5...It works in Firefox and Safari. In chrome it works one time for each thumbnail, then doesnt load the video if you click it again. Is there a better way to do this? The html is like <code>&lt;a href = "#" rel ="videos/video1" class = "image"&gt;&lt;a href = "#" rel ="videos/video2" class = "image"&gt;</code></p>
  
  <pre><code>  $(function() {
      $(".image").live('click',function() {
      var image = $(this).attr("rel");
      var title = $(this).attr("alt");
      $('#largevideo').hide();
      $('#largevideo').fadeIn(1500);  
     $('#largevideo').html('&lt;video controls&gt;&lt;source src="'+image+'.mp4" type="video/mp4"/&gt;&lt;source src="'+image+'.webm" type="video/webm"/&gt;&lt;source src="'+image+'.ogv" type="video/ogg"/&gt;&lt;embed src=".'+image+'.mp4" type="application/x-shockwave-flash" autoplay="0"allowfullscreen="true" allowScriptAccess="always"&gt;&lt;/embed&gt;&lt;/video&gt;');    
      return false;
          });
          (location.attr)? $("a [rel="+location.attr+"]").click():$(".thumbs a:first").click();
  
      });
  </code></pre>