Youtube 实时聊天框无法在 iframe 中正确显示答案

【问题标题】：Youtube live chat box is not display properly in iframeYoutube 实时聊天框无法在 iframe 中正确显示
【发布时间】：2020-07-04 01:02:14
【问题描述】：

我正在尝试在网站中添加聊天框。 youtube 实时聊天的聊天框无法正常显示。这是我的 jsfiddle 链接

https://jsfiddle.net/webregister/wnbz0edo/15/

如果您发现聊天没有运行。请使用 youtube 分享选项从任何 youtube 直播中获取新的 youtube id。在 iframe src url 中替换您的 ID 中的 YOUTUBE-ID

 <iframe  src="https://www.youtube.com/live_chat?v=YOUTUBE-ID&embed_domain=fiddle.jshell.net" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

【问题讨论】：

标签： javascript css youtube youtube-livestreaming-api

【解决方案1】：

您缺少 iframe 容器的高度：

.pop-iframe-container {
  height: 100%;
}

工作小提琴：

https://jsfiddle.net/kmturley/4Lxu6kvd/1/

【讨论】：