Question

在我开始之前，我想提前道歉，如果这个问题是重复的，或者我的语法的一部分并非完美到使用此服务提出问题的令人难以置信的荒谬标准 - 我几乎可怜地害怕在这里问到担心被滥用，因为我的问题看起来很长，而且＃34;或者过于相似＆＃34;其他人 - 但我已经尝试过许多答案/解决方案，在提出问题之前提供给类似问题，但没有一个能帮助解决我的具体案例。即使是一些类似问题的答案也与我的案例无关，但我仍然尝试过它们，当然没有运气。

简单来说，我已将视频上传到Google云端硬盘，我希望将其嵌入到我的网站上。我从Google云端硬盘上的视频的共享视频页面中检索了一个嵌入代码：

<iframe src="https://drive.google.com/file/d/0B8DK7pele_HjWUR6Ym9KNFU5YTQ/preview" width="640" height="480"></iframe>

如您所见，这只是网址的iframe：https://drive.google.com/file/d/0B8DK7pele_HjWUR6Ym9KNFU5YTQ/preview

访问上述网址时，我会看到一个YouTube风格的视频播放器的全屏视图（点击图片中心的播放按钮后），以及非常令人沮丧的＆＃39;弹出＆＃39;箭头符号（在页面的右上角）。我不希望我网站的用户链接回我的视频的Google云端硬盘共享视频页面（即https://drive.google.com/file/d/0B8DK7pele_HjWUR6Ym9KNFU5YTQ/view）。我想做的就是删除烦人的“弹出”＆＃39;箭头符号选项。

使用谷歌浏览器，我通过右键点击“弹出”来做了一些测试。箭头符号并点击＆＃39;检查元素＆＃39; - 这使我进入了页面的代码，选择了一个不相关的部分。我设法找到了淡入淡出式按钮/栏的div元素 - 代码是：

<div class="drive-viewer-v2-toolstrip" role="toolbar" style="width: 52px; right: 0px; opacity: 0;"></div>

我编辑了代码，看看是否可以添加这段简单的CSS代码：display: none：

<div class="drive-viewer-v2-toolstrip" role="toolbar" style="width: 52px; right: 0px; opacity: 0;display: none;"></div>

它确实 - 当我把光标悬停在“弹出”上时。箭头图片，它没有显示。当我点击其区域时，它不会打开Google云端硬盘共享视频页面，而是播放视频。

唯一的问题是它是在实际视频页面上编辑代码的测试。我真的想知道的是：是否有任何方式，使用 ANY 编程语言（HTML，CSS，JavaScript，PHP等），删除这个令人沮丧的＆＃39; Pop out＆＃39;通过iframe在我的页面上的箭头？我花了好几个小时试图使用javascript代码，css代码，甚至PHP代码来回答类似的问题甚至不同的网站都没有运气。

我想在页面中添加CSS，就好像我将其添加到官方视频页面（我的网站iframe通过Google提供的嵌入代码页面） - 我认为这个CSS是正确的：

.drive-viewer-v2-toolstrip {
display: none;
}

我理解与跨域＆＃39;规则会阻止此代码对iframe页面产生任何影响 - 但是任何方式，甚至是hack，只需添加该代码或删除“弹出”＆＃39;符号图像？！

正如您所知，我不是一位经验丰富的程序员，所以非常感谢一些支持。

注意： - 使用的视频仅用于示例目的 - 它不是实际视频，但我认为我可以将iframe src更改为实际视频的URL。 - 要查看我的测试页，请转到此处：http://freemedia.x10.mx/index.html（抱歉 - 这个网站很幼稚，并且不会因为我没有＆＃34; 10而允许我发布两个以上的链接声誉＆＃34;。）

Answer 1

您是否尝试使用HTML5的<video>标记直接嵌入视频（无论如何，这都在您的iframe内）？

<video class="video-stream html5-main-video" style="width: 640px; height: 480px; left: 0px; top: -480px; transform: none;" src="https://r10---sn-4g57kney.c.docs.google.com/videoplayback?requiressl=yes&amp;shardbypass=yes&amp;cmbypass=yes&amp;id=951765eacbdee2ee&amp;itag=18&amp;source=webdrive&amp;app=docs&amp;ip=217.5.178.213&amp;ipbits=0&amp;expire=1432754244&amp;sparams=requiressl,shardbypass,cmbypass,id,itag,source,ip,ipbits,expire&amp;signature=691BAE82BA1FE4D4084DCCB9C1EBDA134AF4312B.A789605BB07CC90CBAE60AD24A9631022835B6DC&amp;key=ck2&amp;mm=30&amp;ms=nxu&amp;mt=1432750367&amp;mv=u&amp;nh=IgpwcjAxLmZyYTAzKgkxMjcuMC4wLjE&amp;pl=23&amp;cpn=jL7UCwA73YsFunXs&amp;c=WEB&amp;cver=html5"></video>

编辑：

我刚刚对此进行了测试，但由于src没有直接指向视频文件，而是直接指向许多POST参数，谷歌会在嵌入iframe时创建视频，因此无效。你能下载视频文件吗？

Answer 2

有一种野蛮的方法可以做到这一点：

<div class="iframe_hide_poop">
<div class="magic"></div>
<iframe src="...."></iframe>

</div>

然后css部分是：

.iframe_hide_poop{
 position:relative;
//add your stuff
}
.iframe_hide_poop iframe{
  position:relative; 
  //add your stuff
}
.magic{
  position:absolute;
  width:80px; 
  height:80px;
  top:20px; //adjust the value
  right:20px;//adjust the value
  background-color:#000;
}

通过这种方式，将有一个80X80黑色区域＆＃34;以上＆＃34;弹出按钮阻止用户看到弹出窗口，或者您可以将.magic的宽度更改为100％，如果您认为它看起来更好，它将显示为精简横幅。

将CSS添加到iframe页面？

2 个答案:

编辑：