IE9正在覆盖带有视频缩略图的HTML5视频的海报属性

在这个问答内容中，我们可以看到涉及到以下几个关键词：

1. IE9
2. HTML5视频
3. 海报属性
4. 视频缩略图

首先，我们来了解一下这些关键词的含义：

1. IE9：这是微软推出的一款浏览器，已经比较老旧，但在某些特定的场景下仍然有使用。
2. HTML5视频：HTML5是一种标准的网页编程语言，其中包含了视频播放的功能。
3. 海报属性：这是一个HTML5视频的属性，用于指定视频播放器在加载视频时显示的图像。
4. 视频缩略图：这是一个视频播放过程中的缩小版的图像，通常用于在视频暂停或结束时显示。

接下来，我们可以从以下几个方面来回答这个问题：

1. IE9正在覆盖带有视频缩略图的HTML5视频的海报属性：

在IE9中，我们可以使用<video>标签来播放HTML5视频，并且可以通过设置poster属性来指定视频的海报属性。例如：

<video width="320" height="240" controls poster="movie.jpg">

<source src="movie.mp4" type="video/mp4">

<source src="movie.ogg" type="video/ogg">

</video>

其中，poster="movie.jpg"表示将movie.jpg图片作为视频的海报属性。

1. 视频缩略图：

视频缩略图是指在视频播放过程中的某个时刻截取的图像。我们可以使用JavaScript来实现视频缩略图的功能。例如：

<video id="myVideo" width="320" height="240" controls>

<source src="movie.mp4" type="video/mp4">

<source src="movie.ogg" type="video/ogg">

</video>

<img id="thumbnail" src="" alt="Video thumbnail">

<script>

 var video = document.getElementById('myVideo');

 var thumbnail = document.getElementById('thumbnail');

 video.addEventListener('timeupdate', function() {

   if (video.currentTime > 1) {

     thumbnail.src = captureThumbnail();

   }

 });

 function captureThumbnail() {

   var canvas = document.createElement('canvas');

   canvas.width = video.videoWidth;

   canvas.height = video.videoHeight;

   var ctx = canvas.getContext('2d');

   ctx.drawImage(video, 0, 0, canvas.width, canvas.height);

   return canvas.toDataURL();

 }

</script>

上述代码中，我们使用timeupdate事件来监听视频播放的进度，当视频播放时间超过1秒时，就会截取当前帧的图像作为缩略图，并将其显示在<img>标签中。

综上所述，我们可以通过设置poster属性和使用JavaScript来实现在IE9中带有视频缩略图的HTML5视频的海报属性。