답변:
?wmode=opaque
URL에 추가 하거나 &wmode=opaque
이미 매개 변수가 있는지 확인하십시오.
작동하지 않으면 대신 &wmode=transparent
IE 브라우저에서도 작동합니다.
opaque
와transparent
. opaque
더 성능이 뛰어나야합니다.
새로운 비동기 API를 사용하는 경우 다음과 같이 매개 변수를 추가해야합니다.
<!-- YOUTUBE -->
// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "http://www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// 3. This function creates an <iframe> (and YouTube player)
// after the API code downloads.
var player;
var initialVideo = 'ApkM4t9L5jE'; // YOUR YOUTUBE VIDEO ID
function onYouTubePlayerAPIReady() {
console.log("onYouTubePlayerAPIReady" + initialVideo);
player = new YT.Player('player', {
height: '381',
width: '681',
wmode: 'transparent', // SECRET SAUCE HERE
videoId: initialVideo,
playerVars: { 'autoplay': 1, 'rel': 0, 'wmode':'transparent' },
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
이것은 Google 문서 및 예제를 기반으로합니다 : http://code.google.com/apis/youtube/iframe_api_reference.html
?wmode=opaque
아직 IE에서 테스트하지는 않았지만 URL에 추가하면 이 문제가 해결되는 것 같습니다.
이전에 제안 된 솔루션에 문제가있는 사람들은 이미 앰퍼샌드가 URL에 다른 인수를 제공 한 경우에만 작동합니다. 첫 번째 인수에는 초기 물음표가 있어야합니다.http://www.example.com?first=foo&second=bar
&wmode=transparent
URL에 추가 하면 테스트가 완료된 것입니다.
나는 자신의 워드 프레스 플러그인 YouTube 단축 코드 에서이 기술을 사용합니다.
문제가 발생하면 소스 코드를 확인하십시오.
나는 이것이 오래된 질문이라는 것을 알고 있지만 여전히이 문제에 대한 인기 검색어에 나타납니다. 그래서 IE에 대한 질문을 찾는 사람들을 돕기 위해 새로운 답변을 추가하고 있습니다.
&wmode=opaque
IE 10에서는 URL 끝에 추가 할 수 없습니다 ...
그러나 추가 ?wmode=opaque
는 트릭을 수행합니다!
이 솔루션을 여기에서 찾았습니다 : http://alamoxie.com/blog/web-design/stop-iframes-covering-site-elements
&
그리고 ?
그들이 사용하고있는 다른 설정이 URL에 포함되는 순서에 따라 모두 정확합니다. ?
이것이 첫 번째 (또는 유일한) 설정이면 분명히 사용됩니다 &
.
최근에 나는 때때로 플래시 플레이어가 인식하지 못하는 것을 보았습니다 &wmode=opaque
. 대신 &WMode=opaque
에도 전달해야 합니다 (대문자에 유의 하십시오).