GoogleのWebブラウザー「Chrome 70」のWindows版/mac版/Linux版が、新機能「ピクチャーインピクチャー(PIP)」に対応するようになった。
ピクチャーインピクチャー(PIP)とは、Chrome上で再生している動画を、画面の隅に別ウィンドウで再生する機能である。この機能を使えば、画面の隅に小さな動画ウィンドウを表示できるため、動画を再生しながら様々なパソコン作業を行えるようになる。
Chromeでピクチャーインピクチャーを利用する方法
- Chromeで動画を再生する
- 動画を右クリック(または2回右クリック)する
動画の再生がはじまったら、動画の上で右クリック(YouTubeのように右クリックで独自メニューが表示される場合は2回右クリック)して、表示されるメニューで[ピクチャーインピクチャー]をクリックする。 - 画面の右下に動画ウィンドウが表示される
Chrome上で再生していた動画が消えて、画面の右下に新たに動画ウィンドウが表示される。動画がChromeから切り離されたので、ChromeをスクロールしてWebページを読み進めたり、新たなタブに別のWebページを表示したりしても、動画ウィンドウの動画を見続けられる
CSSのdisplay-modeでピクチャーインピクチャーをサポート
2024/3/20にリリースされたChrome 123でピクチャーインピクチャーがサポートされた。対象となるChrome 123は、Android、ChromeOS、Linux、macOS、Windowsに適用される。
これより、Webアプリがピクチャインピクチャモードで表示される場合にのみ適用されるCSSルールを作成できる。
@media all and (display-mode: picture-in-picture) {
body {
margin: 0;
}
h1 {
font-size: 0.8em;
}
}