像CNN网站一样扩展视频播放器，基于jQuery

Question

我想知道是否有人知道脚本/插件，基于jquery或其他，这可以用来实现可以在CNN.com上找到的效果。 我正在谈论由小缩略图代表的视频，当点击时会扩展到文本并播放。

我绝不是一个JS-guru，而我和闪光灯并不是最好的朋友，但我并不是完全克服的。

基本上，我正在寻找的是一种点击缩略图，展开swf并在我再次收缩时停止它的方法。类似的东西。

欢迎任何想法，提示或见解！

Answer 1

一种简单的方法是在点击时用Flash视频替换div的内容：

<强> HTML

<div id="video-001">
    <img src="video-thumb.jpg" />
</div>

<强>的jQuery

$('#video-001').toggle(function() {
    $(this).html('<object whatevergoeshere...></object>');
}, function() {
   $(this).html('<img src="video-thumb.jpg" />');
});

这是一个简单的例子，但可以通过将图像作为div背景插入，将代码保存在元素的缓存中（使用.data()），可以对其进行大量改进，添加点击具有特定类别的所有div的活动...

希望有所帮助：）