如何在视频播放时使页面变暗？

我已经看到这样做了几次，整个页面在播放视频时会变黑或变黑。我想知道如何使用HTML CSS或Javascript来完成这项工作。如何在视频播放时使页面变暗？

这里是我的意思的例子：http://allmyvideos.net/vc0uqldjebnz

来源

2013-02-14 Batman

数字下载也可 – Tucker 2013-02-14 07:13:12

@gdoron我不知道，如果包裹被传递到的蝙蝠洞 – Najzero 2013-02-14 07:15:06

蝙蝠侠喜欢一切在黑暗中...... – Deadlock 2013-02-14 07:16:29

创建一个叠加的div占据了整个屏幕，是深色或黑色。将它设置为以无显示的方式开始。确保您的视频具有更高的Z-index。然后，当视频播放时，设置覆盖div显示，它应该使页面变黑。

例如，设置这样一个div：

<div id="overlay" style="display:none;position:fixed;width:100%;height:100%;top:0;left:0;opacity:0.6;">&nbsp;</div>

页面加载后，你将不会看到覆盖。然后，当在视频播放，设置显示器（使用jQuery例如）任何东西，但没有一个会显示覆盖

$("#overlay").show();

来源

2013-02-14 07:17:48

.show是一种jQuery方法吗？我的教授不会让我们使用jQuery，但我想var overlay.style.display：block;应该正常工作吗？ – Batman 2013-02-14 07:29:19

是的，.show是jQuery。你的代码“var overlay.style ...”将不起作用。在“常规”Javascript中，执行以下操作：'document.getElementById（“overlay”）。style.display =“block”'这就行了。 – 2013-02-14 07:31:42

听起来不错，谢谢 – Batman 2013-02-14 07:35:05

如何在视频播放时使页面变暗？

回答

相关问题