iframe - 提高YouTube缩略图质量？

Question

通过iFrame代码将YouTube缩略图嵌入网页后，它们看起来很糟糕。视频开始播放后，质量看起来绝对不错。

这是一个示例视频:
http://jsfiddle.net/x5829/

播放前-质量欠佳的缩略图

播放时-优质

无论出于何种原因，它似乎都在使用hqdefault.jpg质量图像，而不是使用质量更高的maxresdefault.jpg。

我尝试将iFrame的尺寸增加到1280x720，甚至更高，似乎没有什么不同。

可以使用JavaScript API进行任何操作来强制使用缩略图质量吗？我们保证使用的所有视频均为720p。

最后一点(我认为这并不重要)，我们使用YouTube API(V3)上传视频，然后通过API设置缩略图。但是，当使用YouTube选择的自动生成的缩略图时，也会发生同样的事情。

编辑-我想知道这是否会随着时间的推移而改善，以为YouTube可能会在24小时内对其进行优化，但几天后仍然如此。

编辑2-据我所知，iFrame仍然是Google将视频嵌入网站的“推荐”方法，以便它们也可以在移动设备上使用。

Answer 1

我遇到了类似的问题，并提出了以下解决方案:

制作包含高分辨率缩略图的图像(来自url)

在底下使用所需分辨率的iframe(使用z-index)

使用position:absolute

对齐这两个

都被链接包围，这会使图像在悬停时消失

.video-box{
    height:220px;
    width:391px;
    position:relative;
}

.video-thumbnail{
    z-index:300;
    position:absolute;
    top:0;
    left:0;
    width:100%;
}

.video-frame{
    z-index:100;
    position:absolute;
    top:0;
    left:0;
    width:100%;
}

.thumbnail-link .video-thumbnail{
    display:block;
}

.thumbnail-link:hover .video-thumbnail{
    display:none;
}

悬停时，会显示较低质量的缩略图，但是youtube播放按钮会更加突出。而且，看起来背景似乎有点模糊。

让我知道你的想法。

示例: http://jsfiddle.net/d9D9E/1/