围绕视频的暗淡网页

Question

我试图围绕视频调整网页，尽管我试图通过按钮调暗，这对我来说不起作用This example，我想要的是网站自动调暗当我进入网站时，

（图片）

我的网站在进入时自动播放视频，我希望空白变暗，类似于youtube魔术选项。我的css看起来像这样，

#encase {
    width: 1280px;
    height: 820px;
    margin-left: auto;
    margin-right: auto;
    font-size: 1em;
}
#blankSpace {
    width: 1280px;
    height: 100px;
    border: 1px solid yellow;
}
#wholeBody {
    width: 1280px;
    height: 720px;
    border: 1px solid green;
}
#body {
    width: 1280px;
    height: 720px;
}

它是一个巨大的容器，里面有3个div，空白空间只是为了将视频放在另一个包含身体的div中。或者，如果不可能，如何点击按钮点击（因为另一种方法对我不起作用）。谢谢。 JsFiddle click dim (doesn't work)