これはどのブラウザでも問題なく動作しますが、iOS6 では動作しません (iOS5 では試していません)。
オーバーレイに配置された YouTube ビデオを含む iFrame を取得しました。ビデオを再生してオーバーレイを切り替えた後、ビデオが再び壊れます。ビデオはバックグラウンドで再生されますが (音声が聞こえます)、表示されなくなります。
最小限の例を次に示します:
http://jsfiddle.net/s9M6J/2/
<script>
/* jQuery */
$(document).ready(function() {
$('a').click(function() {
$('.videowrapper').toggleClass('hidden');
});
});
</script>
<style>
.hidden{
display: none;
}
</style>
<body>
<a href="#" style="display: block;">toggleVideo</a>
<div style="background: green; width: 500px; height: 500px;">
<div class="videowrapper">
<div id="video1">
<iframe width="500" height="315" src="http://www.youtube.com/embed/HMrlFLZFdnQ" frameborder="0" allowfullscreen></iframe>
</div>
</div>
</div>
</body>
誰かがその回避策を知っていますか?