如何调整YouTube播放器的大小,从缩略图大小调整为"正常"大小

Question

我想这与Facebook的做法类似,但是......我还没有弄清楚如何遵循他们的行为,如果这是一个骗局,我道歉.

想法是有一个缩略图大小的玩家(width="220px" height="180px"),当点击时,调整大小为"正常"大小(当然,正常是任意的,但是为了这个例子,如果我们一起使用width="445px",height="364px"作为Youtube的默认值)然后玩.

我假设onClick事件应该更改<object>和<embed>标签中定义的高度和宽度属性,但由于对象是闪存,我假设Flash播放器"捕获"了点击而不是将它们报告给浏览器？

以下视频是我打算使用的视频之一,并在此提供一个真实示例:

<object class="yt" width="445" height="364">
<param name="movie" value="http://www.youtube.com/v/2ieLb3RAblA&hl=en&fs=1&color1=0x3a3a3a&color2=0x999999&border=1"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="http://www.youtube.com/v/2ieLb3RAblA&hl=en&fs=1&color1=0x3a3a3a&color2=0x999999&border=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="445" height="364"></embed>
</object>

作为附录,这可能会在静态html页面中使用一段时间,之后不久就被移到php(5.2)站点,php和html都连接了jQuery 1.3.2,而且我不仅仅是很高兴使用第三方插件,如果存在这样容易.

任何和所有的帮助表示赞赏,我很抱歉询问对我来说可能做什么 - 对我来说 - 似乎是一个愚蠢的问题.我想这应该是显而易见的.

提前致谢.

Answer 1

Facebook使用一个看起来像玩家的缩略图 - 整洁的技巧.我找到了一个jQuery插件,可以获得youtube缩略图,我还没试过.

一些示例代码:

<div id="youtoobin">

</div>

<div id="blarg" style="display:none">
    <object class="yt" width="445" height="364">
    <param name="movie" value="http://www.youtube.com/v/2ieLb3RAblA&hl=en&fs=1&color1=0x3a3a3a&color2=0x999999&border=1"></param>
    <param name="allowFullScreen" value="true"></param>
    <param name="allowscriptaccess" value="always"></param>
    <embed src="http://www.youtube.com/v/2ieLb3RAblA&hl=en&fs=1&color1=0x3a3a3a&color2=0x999999&border=1&autoplay=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="445" height="364"></embed>
    </object>
</div>

和JS:

<script>
    $(function() {
    $("#youtoobin").append("<img id='thumby' src='" + $.jYoutube('2ieLb3RAblA', 'small') + "'/>");

        $("#thumby").live("click", function() {
            $("#youtoobin").html($("#blarg").html());
        });
    });
</script>

我打开了自动播放,因为如果用户点击图像,你可能想要这样做.这应该是集成到您的应用程序的良好起点.jQuery插件唯一能做的就是获取缩略图的网址 - 你可以获得大图像或小图像.