Javascript 在扩展容器和播放视频时隐藏DIV中的内容

我已经看过了，但目前还找不到网站

我有一个英雄形象与播放按钮，当它被点击时，我想隐藏该div的内容，同时扩大它，然后在视频中淡出

我用标签将嵌入的视频绝对定位在英雄副本后面

我可以做CSS转换容器和淡出所有内容，但我对jquery太不熟悉，无法设置它的脚本

你可以看到我目前所拥有的@

---

当前视频已覆盖并自动播放，我是否可以停止预加载并仅在单击播放按钮时加载视频

首先，删除

自动播放

属性：

<video id="video_background" src="http://player.vimeo.com/external/84613377.hd.mp4?s=7820d9cd4d5b295c7f289492772afb90"></video>

您可能会注意到我如何使用

v.get（0）

。这是因为jQuery没有播放视频的方法，您需要获取原始DOM元素，然后调用属于视频元素的

play

方法

---

简单示例。

要删除自动播放，请尝试从视频元素中删除“自动播放”属性，但忘记关闭视频标记。顺便说一句，我喜欢网站设计；）修复了这两个问题-谢谢。谢谢你的支持：你敢这样做吗<代码>$（“#英雄游戏”）.on（'click'，function（）{$（this.fadeOut（）；$（'.slider-inner'）.append（''）；）工作得很有魅力！像你这样的人让我爱上了webz！也许你能帮上忙。。在同一个网站，gigyastaging.com上，我试图让一个“完成”的监听器工作。不确定我做得不对，但它不起作用。我基本上是想隐藏视频播放，并在视频完成后将所有内容恢复正常。@CameronCunningham如果您查看可用的，您将看到一个名为“结束”的事件。你所要做的就是订阅它，并在触发时淡出视频。我已经编辑了我的答案和小提琴来展示一个例子。

<video id="video_background" src="http://player.vimeo.com/external/84613377.hd.mp4?s=7820d9cd4d5b295c7f289492772afb90" style="display: none;"></video>

$("video").on("ended", function(){
    $(this).fadeOut();
});

$("#hero-play").click(function(){
   var v = $("video");

   v.fadeIn();
   v.get(0).play();
});