javascript - 嵌入 Youtube 视频小尺寸但仍然高清质量

Question

将 YouTube 嵌入到我在 blogger.com 的博客中时遇到问题。我希望以下尺寸的视频仍能以高清格式播放。我认为我的问题是不知道我需要更改什么，然后不知道将代码发布在我的博客中的什么位置。

我已经阅读并尝试了 6 个多小时，但仍然无法理解。

width="655" 
height="380"

我从 biostall 找到了有用的代码，但无法让它为我工作。我将 JS 代码放入我博客上的 JS/HTML 小工具中，然后将 HTML 发布到新帖子中，并尝试使用按字面显示 HTML 和解释键入的 HTML 两种设置发布它。

有一个非常有用的代码 from biostall .

HTML:

<div id="player"></div>  

Javascript:

// 1. This code loads the IFrame Player API code asynchronously.  
 var tag = document.createElement('script');  

tag.src = "https://www.youtube.com/iframe_api";  
var firstScriptTag = document.getElementsByTagName('script')[0];  
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);  

// 2. This function creates an <iframe> (and YouTube player) after the API code downloads.  
var player;  
function onYouTubeIframeAPIReady() {  
    player = new YT.Player('player', {  
        height: '1280',  
        width: '720',  
        videoId: 'E37YNMYlKvo',  
        events: {  
            'onReady': onPlayerReady  
        }  
    });  
}  

// 3. The API will call this function when the video player is ready.  
function onPlayerReady(event) {  
    player.setPlaybackQuality('hd1080'); // Here we set the quality (yay!)  
    event.target.playVideo(); // Optional. Means video autoplays  
}  

Answer 1

所以你有一个对象 YT.Player 带有 props height,width,videoId,events

尝试更改为

height: '380' 

width: '655' 

所以

var player;  
function onYouTubeIframeAPIReady() {  
    player = new YT.Player('player', {  
        height: '380',  
        width: '655',  
        videoId: 'E37YNMYlKvo',  
        events: {  
            'onReady': onPlayerReady  
        }  
    });  
} 

...

保持player.setPlaybackQuality('hd1080');//这里我们设置质量(耶!)

因为它决定了质量

顺便说一句，你有两种“类型”720p 和 1080p

回顾

只改变高度和宽度