0

我试图用带有视频的图像替换 3D 立方体以在每个面上添加,我在试图弄清楚如何用 html 视频元素标记替换 html 标记时遇到问题。

我的jsfiddle可以在下面看到

http://jsfiddle.net/sean3200/W4pGa/

这是创建图像的代码的开头......

      function start3d(texture_image) {
       var screen_canvas = document.getElementById('canvas');

这是加载图像的代码的底部

      var img = new Image();
      img.onload = function() { start3d(img); };
      img.src = 'http://content.bitsontherun.com/thumbs/3XnJSIm4-640.jpg';</script>

我知道如何通过 html5 创建和加载视频,但是将它放在每个立方体上有点不同.. 对此的任何帮助将不胜感激!谢谢

4

1 回答 1

0

将此代码放入您的 div

<object width="400" height="400"><param name="movie"    value="http://www.youtube.com/v/YLorLVa95Xo?fs=1&amp;hl=en_GB&amp;rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/YLorLVa95Xo?fs=1&amp;hl=en_GB&amp;rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="400" height="400"></embed></object>

或使用 javascript 在 html 正文中设置多维数据集类的第二个 div 上的视频:

$('.cube > div').eq(1).html('<object width="360" height="360"><param name="movie" value="http://www.youtube.com/v/YLorLVa95Xo?fs=1&amp;hl=en_GB&amp;rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/YLorLVa95Xo?fs=1&amp;hl=en_GB&amp;rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="360" height="360"></embed></object>');

它在 chrome 中运行良好,如果在 safari 和 firefox 中运行,请回复。

于 2013-03-08T06:34:33.993 回答