javascript - 越野车视频标签

Question

我在地狱中花了 6 个小时试图找出是什么故障导致我的视​​频像那样闪烁，并且作为第二个错误，它只是无法加载。我真的吓坏了：X这是我到目前为止所尝试的：

http://jsfiddle.net/RhTTE/

我的 js 文件，我怀疑这可能会导致问题：

$(document).ready(function (){

$('.play').click(function () {
    video = '<iframe width="600" height="375" frameborder="0" src="' + $('img').attr('data-video') + '"></iframe>';
    $('.video').replaceWith(video);
});
});

  var myVideo  = document.getElementById("video1");
  myVideo.style.marginLeft= "-20px";
  var menu = document.getElementById("menu");

function playPause()
{ 
if (myVideo.paused) 
  myVideo.play(); 
else 
  myVideo.pause(); 
} 
function makeBig()
{ 
myVideo.height=325;
myVideo.width=650;
myVideo.style.marginLeft= "-35px";
menu.style.width='650px';
menu.style.marginLeft= "-35px";
} 

function makeSmall()
{ 
myVideo.height=175;
myVideo.width=350;
myVideo.style.marginLeft= "-20px"; menu.style.width='350px';
menu.style.marginLeft= "115px";
} 

function makeNormal()
{ 
myVideo.height=250;
myVideo.width=500;
myVideo.style.marginLeft= "-20px"; menu.style.width='500px';
menu.style.marginLeft= "40px";
} 

PS不知何故，它在codepen的IDE上正常工作。

任何帮助将不胜感激。谢谢！

Answer 1

I figured out the problem: Firstly, as I tested iframe might not work properly combined with video tag in the same web page. And secondly, the script tag's order was incorrect. I don't know why but it's place had to be after the video container's div.