結論
- PC版Chromeで複数のYouTubePlayerは動作可能
- Android版Chromeでも動いた！（Pixel3aで確認）
- iOSのSafariでの挙動がおかしいので要調査（iPhone SE、iPad Proで確認）
- よく考えると、iOSのSafaiでvideoの複数同時再生するための条件から逸脱しているのか（未検証）
- マジですかスカ！は名曲
ことの発端
ひょんなことから、最近ハロプロのことを考える時間が増えたのですが、ふと、過去に「まじですかスカ！」のPVを9本並べて再生するサイトをつくったことを思い出しました。
HDDをサルベージすると、6年前につくっていたことがわかったのですが、当時はまだ、iOSでは動画のインライン再生ができなかった時代ということもあり、スマホでは動かすことができませんでした。
そもそも、PC版Chromeで観覧することを前提にえいや！とつくりましたし。
しかし、あれから時代も進み、いまのスマホなら動くかもしれないと思いまして、颯爽と調査を開始してみることにしたのがことの発端です。
DEMO
こちらがデモページです。
PC版のChromeを使って、それなりのネット回線でご観覧ください。
Pixel3aのChromeでも一応動くことを確認したので、Androidでも動くと思うのですが、YouTubeの動画を9本流すので、すくなくともWiFiに繋いでから観覧した方が良いと思います。ギガが減っちゃうので。
リメイクした箇所
動画のインライン再生対応
YouTubePlayerのパラメータにplaysinlineを渡すように変更しました。
クリックで再生するように変更
もともとは、読み込みが終わったら自動で再生を開始するようにしていたのですが、なぜか音ありのムービーの再生がうまくいかず、クリックきっかけに変更しました。
現象を正確に表現すると、「再生中の音ありの動画をシークして先頭に戻すと何故か動画の再生が終わってしまう」という挙動が解決できませんでした。
6年前は自動再生で問題なかったので謎です。
引き続き、調査が必要なんですが、一旦こちらからは以上です。
