概要
meetsで別のwindowなどに移動した場合に別のポップアップ画面のようなものが表示されるが、最前面に固定される。どのようにやっているのか気になったので調べてみた。
ポップアップウィンドウを利用している??
まず初めに、ポップアップウィンドウを利用していると考えた。
当たり前のようにChrome DevToolsが利用できる。
疑問点:
ソースは見つからなかったが、標準機能ではできないっぽいし、自分もその認識であった。セキュリティリスクであるため利用できないイメージである。
ピクチャinピクチャ機能?
AIに聞いたところピクチャinピクチャ機能の可能性があるとのことであったが、試しに作成してみたところ、DevToolsの表示や動画以外のものを表示することは不可能であった。
しかし、矢印を押すことで画面に戻れるなど、内部的にピクチャinピクチャを利用しているかもしれないとは感じた。
どうやらピクチャinピクチャ!!
実装の部分で違うと感じたが、実際にはピクチャinピクチャで実装しているとのこと。
とすると、ピクチャinピクチャでも同様のことが可能である。
いろいろ調べてみたところこのようなドキュメントを見つけることができた。
動作検証
このような形で適当に作ってもMeetsのような動きが可能である。
まとめ
Web会議等を自作する場合はめちゃくちゃ便利そうに感じた。
最初はポップアップウィンドウで実装だと思っていたためそちらメインで調べていたので、偶然ではあるがピクチャinピクチャと表示してくれたGoogleには感謝である