带有jQuery的html 5视频缩略图库

时间:2012-02-26 18:53:32

标签: html5-video jquery

我一直在尝试将代码从图像缩略图库更改为视频缩略图库。我有各种格式的视频编码为html 5 ...它适用于Firefox和Safari。在Chrome中,每个缩略图都会运行一次,如果再次单击它,则不会加载视频。有一个更好的方法吗? html就像<a href = "#" rel ="videos/video1" class = "image"><a href = "#" rel ="videos/video2" class = "image">

  $(function() {
    $(".image").live('click',function() {
    var image = $(this).attr("rel");
    var title = $(this).attr("alt");
    $('#largevideo').hide();
    $('#largevideo').fadeIn(1500);  
   $('#largevideo').html('<video controls><source src="'+image+'.mp4" type="video/mp4"/><source src="'+image+'.webm" type="video/webm"/><source src="'+image+'.ogv" type="video/ogg"/><embed src=".'+image+'.mp4" type="application/x-shockwave-flash" autoplay="0"allowfullscreen="true" allowScriptAccess="always"></embed></video>');    
    return false;
        });
        (location.attr)? $("a [rel="+location.attr+"]").click():$(".thumbs a:first").click();

    });

0 个答案:

没有答案