下面是我的代码示例,我正在尝试使用播放列表,其中播放器将处于全宽和全高状态,但由于某种原因它无法正常工作。所以我想要完成的是播放器将在整页上没有任何其他内容。什么都不会出现 example link这是 link for fiddle任何帮助将不胜感激。
复制代码
<html>
<head>
</head>
<body onload="load()" style="background-color:white">
<script type="text/javascript">
var playlisturl = "http://gdata.youtube.com/feeds/api/playlists/PL704DA9FE5E10160C?v=2";
var playlisturls = ["http://gdata.youtube.com/feeds/api/playlists/PL704DA9FE5E10160C?v=2"];
var pause_playlist_text = "Pause playlist (loop current video)";
var embed = true;
var autoplay = true;
var vwidth = 400;
var vheight = 500;
</script>
<script type="text/javascript" src="http://youtube-playlist-randomizer.valami.info/seedrandom.js"></script>
<script type="text/javascript" src="http://youtube-playlist-randomizer.valami.info/playlist2-min.js"></script>
<div id="control_buttons" style="display:none">
<button style="display:none" id="nextbutton" onclick="next()">Play next</button> <span style="display:none" id="videosleft"></span> <button style="display:none" id="previousbutton" onclick="previous()">Play previous</button>
<button style="display:none" id="pauseplaylist" onclick="pause_playlist()">Pause playlist (loop current video)</button> <button style="display:none" onclick="reshuffle()">Reshuffle</button>
</div>
<script type="text/javascript">
document.getElementById('pauseplaylist').style.display = "none"
</script>
<div id="video">
<p>Loading playlist...</p>
</div>
<div class="videowrapper">
<div id="myytplayer"></div>
</div>
<script type="text/javascript">
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var ytplayer;
function onYouTubeIframeAPIReady()
{
ytplayer = new YT.Player('myytplayer', {
height: vheight,
width: vwidth,
videoId: '8tPnX7OPo0Q',
events: {
'onReady': onYouTubePlayerReady,
'onStateChange': onytplayerStateChange,
'onError': onytplayerError
}
});
}
</script>
</body>
</html>
最佳答案
将容器的宽度和高度设置为 100%,检查一下:
#myytplayer {
width:100%;
height:100%;
}
.videowrapper {
width:100%;
height:100%;
}
关于javascript - 如何解决 youtube 播放器未显示完整宽度和高度的问题?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29246830/