定着したネット動画

ネット動画はYouTubeに始まり、今やGYAO!やAbemaTVなどのインターネットTV的な媒体に成長しました。 ユーザーによっては、既存のTV放送よりもこういった媒体を主に視聴している人もいるかも知れません。

 

この様なストリーミング配信のページに対するアレンジは、userstyles.org上で結構見かけます。 私は余りアレンジの必要を感じていなかったのですが、数日前にGYAO!の動画ページを開くと、動画が全画面表示になりません。 この不具合は、Win10 Pro / Google Chrome の環境でのみ生じていて、他のブラウザやOSの組み合わせでは問題がなく、私のPCの固有の条件が関係しているのかも知れません。

 

問題はいずれ改善されるかも知れませんが、現在の全画面表示にならない動画を見るに耐えないので、Stylusで動画を全画面表示に変えるアレンジスタイルを作りました。 そして、スタイルが出来上がってみると正常な環境でも使い勝手が良いので、「GYAO動画のフル画面表示」として公開する事にしました。 これは、Chrome / Firefox のブラウザで有効なスタイルです。

 

 

 

動画の拡大表示の仕方を自由にコントロール出来る

「GYAO動画のフル画面表示」は、ブラウザウインドウの動画を、「強制的」に全画面表示にします。 デフォルトの GYAO! 動画ページでは、動画コントローラーの「全画面」のボタンを押すことでモニター全画面の動画表示になります。 それに対して、このスタイルを適用すると、ウインドウ幅のサイズによって、全画面の表示かどうかが切り替わります。(コントローラーの全画面ボタンも有効です)

 

● ブラウザウインドウ幅が 1024pxより大きくなると、動画がウインドウ内で最大に拡大表示されます。 デフォルトと異なり、ブラウザウインドウがモニター全体を覆っていない状態でも、動画以外を表示しない動画プレイヤーの状態に出来ます。

 

 

● この状態でブラウザウインドウの「最大化」ボタンを押すと、ウインドウのタブ部とコントロールバーのある上図の動画プレイヤーが、モニター全面に表示されます。 

 

 

● 更に、キーボードで「F11」を押し、ブラウザウインドウを「全画面表示」にすれば、本来の動画コントローラーの「全画面」を押すのと同様の動画のフルスクリーン表示になります。(ウインドウのタブ部とコントロールバーは非表示になります)

 

つまり、デフォルトの「全画面」「ESC」の操作の代わりに「F11」を押して「動画のフルスクリーン表示」と「通常のページ表示」を切替える形になり、また中程度のウインドウサイズでも動画を拡大表示することが可能になります。

 

なお、この「GYAO動画のフル画面表示」はシンプルなアレンジコードで、システム負担や動画の劣化などの心配はありません。

 

 

 

「GYAO動画のフル画面表示」を利用するには

「GYAO動画のフル画面表示」を利用するには、ブラウザに拡張機能「Stylus」を導入する必要があります。「Stylus」はCSSコードで書かれたスタイルを、ブラウザが開いたページに適用する機能です。

 

 ❶ 拡張機能「Stylus」を導入

「GYAO動画のフル画面表示」は Chrome / Edge / Firefox など拡張機能「Stylus」が対応する全てのブラウザで利用可能です。

 

使用されているブラウザに拡張機能「Stylus」を導入します。 導入する手順は、以下のリンクを参照ください。 (EdgeはChrome版が使えます)

すでに「Stylus」を使用されている場合は、❶ の操作は不要です。

 

 

 

 

❷ 「GYAO動画のフル画面表示」のスタイルを入手

 「GYAO動画のフル画面表示」の最新版は、以下のページから入手できます。

 

 

このリンク先のページは以下の様な画面です。

 

 

サンプル画像の下の install ボタンを押します。

 

この操作で下の様な「Stylus」のインストール画面が表示されます。 画面の左上にある インストール {S} のボタンをもう一度押します。

 

 

「スタイルがインストールされています」と表示されたら、この画面を閉じます。

 

「GYAO!」のサイトを表示してみてください。 アレンジが適用されて、上記の説明の通りの動画表示になると思います。

 

もし、このアレンジが気に入らなかったり、不都合な場合は、「Stylus」の「管理画面」を開いて 「GYAO動画のフル画面表示」の行の先頭のチェックを外すと、このスタイルをOFF(無効)にできます。

 

 

 

 

セクション構成とオプションについて

「GYAO動画のフル画面表示」ver.202109.20.02 は、下の 7セクション構成です。

 

  1:  GYAO 全ページ共通のスタイル

 

  2:  ランキング・新着・タイトル一覧・検索結果・更新カレンダー

 

  3:  配信予定・各種selection

 

  4:  個別の動画ページ 基本表示

 

  5:  動画プレーヤー (基本コード 1200px以上で全ウインドウ表示 )

 

  6:  動画プレーヤー (オプション 1024px以上で全ウインドウ表示 )

 

  7:  特設ページの修復

 

 

◎ 初期値は「セクション5」が有効、「セクション6」が無効に設定されています。 この設定により「1200px」から全ウインドウ表示に切り替わります。

◎「セクション5」を無効にし、「セクション6」を有効に変更すると、「1024px」から全ウインドウ表示に切り替わる様になります。 

◎ 変更の手順

▪「Stylus」の管理画面で「GYAO動画のフル画面表示」の「スタイル名」の部分をクリックして、このスタイルの「編集画面」を開きます。

▪「編集画面」には「セクション1 ~ 7」の 7個のセクション枠が表示されます。

▪「セクション5」の枠の先頭に「適用先」の枠が4行あります。

 

 

▪ デフォルトの「適用先」は、上図の様に全て「次で始まる URL」になっています。 これを4個とも「正規表現に一致する URL」に変更します。(無効化)

▪ 次に「セクション6」の先頭にスクロール移動します。 左メニューの「セクション」の目次行をクリックすると、直接に先頭を表示できます。

 

 

▪「セクション6」の初期値は上図の様に「適用先」が「正規表現に一致する URL」になっています。 これを全て「次で始まる URL」に変更します。(有効化)

▪ 最後に、「編集画面」の左上端の「保存」ボタンを押します。

 

以上で「セクション6」のオプションが有効になります。 元に戻すには、上の「適用先」の設定を元に戻してスタイルを「保存」します。