徘徊在模糊的视频上，如何解开指针周围的圆圈

Question

在搜索了很长时间后，我的问题是：

当我将鼠标悬停在html5视频上时，如何显示该部分视频模糊？

以下是一些代码：

<div id="container">
  <video id="videobcg" preload="auto" autoplay="true" loop="loop" muted="muted" volume="0">
  <source src="http://clips.vorwaerts-gmbh.de/VfE_html5.mp4" type="video/mp4">
Sorry, your browser does not support HTML5 video.
</video>

#container {
  width: 640px;
  height: 360px;
  overflow: hidden;
  -webkit-filter: blur(15px);
  -moz-filter: blur(15px);
  -o-filter: blur(15px);
  -ms-filter: blur(15px);
  filter: blur(15px);
}

#videobcg {
  width: 100%;
  height: auto;
}

所以，当它变得模糊时，我想悬停并在指针周围显示一个圆圈，这样你就可以看到模糊的div。

非常感谢你的帮助。如果我需要使用画布，只需找到任何答案。

不要忘记这是一段视频，所以这样的事情对我不起作用，因为我需要在用户互动时播放视频：

http://codepen.io/jalalazimi/details/tCGbw