具有嵌入的视频替换图像

StackOverflow https://stackoverflow.com/questions/838878

题

你好我想，使其加载更快修改网页。 因为我有一些内嵌视频（blip.tv但如果它帮助它可以改变到YouTube）我在想，如果你能加载图像，其中视频应该是和点击更换与视频图像并开始播放（无需重新加载整个页面）。 我想我以前见过这个，但无法找到它的任何地方了！ 现在嵌入我使用的代码是：

<object data="http://blip.tv/play/gYMo_vAmAA" type="application/x-shockwave-flash" height="500" width="600"><param name="src" value="http://blip.tv/play/gYMo_vAmAA"><param name="allowfullscreen" value="true"></object>

由于

有帮助吗？

解决方案

快速和肮脏的：你可以只设置嵌入代码作为一个全局变量的地方：

<script type="text/javascript">
    var embedCode = '<object data="http://blip.tv/play/gYMo_vAmAA" type="application/x-shockwave-flash" height="500" width="600"><param name="src" value="http://blip.tv/play/gYMo_vAmAA"><param name="allowfullscreen" value="true"></object>'
</script>

然后把图像中的容器的div和替换容器的innerHTML的onclick：

<div id="videocontainer">
    <img src="yourimage.jpg" onclick="document.getElementById('videocontainer').innerHTML = embedCode;" height="500" width="600" />
</div>

其他提示

有一个名为SWFObject的谷歌代码项目，这是完美的你所需要的。这是一个跨浏览器的JavaScript库加载闪存 - 当有人点击了图片，例如，你可以使用它与Flash视频来替换你的形象

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top