8

我可以通过此处描述的链接轻松获取 Youtube 图像缩略图：如何从 YouTube API 获取 YouTube 视频缩略图？

但是所有这些缩略图都是 3:4 格式（或类似的格式），即使视频本身是其他格式。然后在图片的顶部和底部可以看到一些黑色的水平条。

我需要一张没有黑条的 9:16 格式（这是我的视频格式）的图像。这有可能收回吗？

更新

尽管 Youtube 页面上的视频上没有黑条，但 Youtube 视频本身的顶部和底部似乎也有黑条。

有什么方法可以简单地以正确的格式显示缩略图和视频？

更新

我发现了这个：删除 youtube 缩略图上的黑色边框 4:3

提问者想要移除黑色的顶部和底部条。这里最好的答案是通过手动校正调整高度并“隐藏”黑条。下面的一些评论也表明了这一点。
这是否意味着无法避免？

4

3 回答 3

18

YouTube 提供的图像没有 4:3 比例的黑条。要获得没有黑条的 16:9 视频缩略图，请尝试以下方法之一：

http://img.youtube.com/vi/<insert-youtube-video-id-here>/mqdefault.jpg
http://img.youtube.com/vi/<insert-youtube-video-id-here>/maxresdefault.jpg

第一个mqdefault是 320x180 像素的图像。

第二张maxresdefault是 1500x900 像素的图像，因此需要调整大小才能用作缩略图。这是一个很好的图像，但它并不总是可用。如果视频质量低（我想不到 720p，不确定），则此“maxresdefault”将不可用。所以永远不要依赖它。

于 2013-09-24T10:37:19.720 回答
8

根据 API 文档：

yt:name 属性值为 mqdefault 的标记标识 320x180 (16:9) 缩略图图像。此图像也没有时间戳，并且可能来自视频中的任何点。

所以有一个图像可用于 16:9 格式的每种视频分辨率（至少我已经测试过）。当然，这不是这个星球上最大的图像......

如果尺寸是一个问题，并且您需要更大的东西，那么最好的选择实际上是选择始终为 4:3 比例的可用选项之一，并使用 CSS 隐藏多余的选项。YouTube 本身已经这样做了很长时间。他们现在在其网站上使用多种缩略图大小，包括mqdefault.jpg.

当所有尺寸都已知时，从图像中隐藏多余的宽度和/或高度真的很容易。这是一个使用来自 YouTube 的 4:3 图像的示例，其中隐藏了黑条，留下 16:9 的结果。为了您的享受，对 CSS 进行了评论。

于 2013-04-02T22:41:07.620 回答
1

在网上搜索了一段时间以解决此问题后，我一无所获，我想我已经尝试了一切，但没有解决我的问题。然后在我的逻辑驱动下，我只是将嵌入式 youtube 视频的 iframe 包装在一个 div 集溢出：隐藏；到这个 div 并使其高度比 iframe 高度小 2px（在我的视频中，底部有黑色边框）。所以包装器 div 比 iframe 小，并且通过将其定位在视频上，您可以隐藏您不想要的黑色边框。我认为这是迄今为止我尝试过的所有方法中最好的解决方案。

在下面的这个例子中，尝试只嵌入 iframe，你会在底部看到小的黑色边框，当你将 iframe 包裹在 div 中时，边框消失了，因为 div 与 iframe 重叠并且它比视频小，而且它has overflow: hidden 所以所有超出 div 维度的东西都被隐藏了。

<div id="video_cont" style="width: 560px;
                            height: 313px;
                            overflow: hidden;">


    <iframe id="the-video" class="extplayer" width="560" height="315" src="https://www.youtube.com/embed/EErx017kDHQ?&amp;autoplay=0&amp;rel=0&amp;fs=0&amp;showinfo=0&amp;controls=0&amp;hd=1&amp;wmode=transparent&amp;version=2;yt:quality=high;"   frameborder="0" allowfullscreen></iframe>

</div>

在我的情况下，边框的高度约为 2px，因此我将包装器 div 的高度缩小了 2px 以隐藏边框，在您的场景中，如果边框位于视频的顶部或两侧和/或具有不同的尺寸，您必须为包装器 div 制作不同的尺寸并将其放置好，以便它与边框所在的视频重叠并且溢出：隐藏；边界是隐藏的。

希望这会有所帮助。

于 2013-10-04T07:52:42.280 回答