问题
div with the video is initially hidden(with display: none;), but iframe seems to be loaded just fine, on press of a button I first change display: none; to display: block;, then do player(which is the instance of yt player) player.playVideo(), nothing unusual, really. But it throws this error.
Logging out player.playVideo indeed returns undefined.
Logging player, returns this
{
"b":{
"b":{
"width":1259,
"height":709,
"videoId":"videaidhere",
"playerVars":{
"autoplay":0,
"controls":0,
"showinfo":0,
"rel":0,
"modestbranding":1,
"html5":0,
"wmode":"transparent"
}
},
"defaults":{
"host":"http://www.youtube.com",
"title":"video player",
"videoId":"",
"width":640,
"height":360
},
"a":false
},
"a":{
"closure_uid_78774223":2
},
"o":{
},
"closure_uid_78774223":1,
"s":1,
"d":130,
"u":false,
"t":[
{
"event":"command",
"func":"addEventListener",
"args":[
"onReady"
]
},
{
"event":"command",
"func":"addEventListener",
"args":[
"onStateChange"
]
}
],
"g":{
"a":[
null,
"onReady",
null,
null,
"onStateChange",
null,
null
],
"b":{
"onReady":[
1
],
"onStateChange":[
4
]
},
"G":7
},
"h":"player",
"D":{
"onReady":true,
"onStateChange":true
},
"k":{
},
"i":{
}
}
It works on every browser but IEs, what should I do?
回答1:
The reason is indeed simply because the div is initially hidden, all you need to do is to hide it some other way, I didn't really have much success with visibility: hidden; or opacity: 0;, top: -alot; along with parent being overflow: hidden; did the job.
This piece of code from Harry Roberts could probably do the job as well.
/**
* Hide content off-screen without resorting to `display:none;`, also provide
* breakpoint specific hidden elements.
*/
@mixin accessibility{
border:0!important;
clip:rect(0 0 0 0)!important;
height:1px!important;
margin:-1px!important;
overflow:hidden!important;
padding:0!important;
position: absolute!important;
width:1px!important;
}
来源：https://stackoverflow.com/questions/23595658/youtube-js-api-internet-explorer8-inc-10-script438-object-doesnt-suppor