再生画面が横いっぱいに広がらない
ワールドカップを楽しんでいたら、DAZNの再生画面の左右が広がらない？
少し邪魔なので、「視聴中の一時的な対処(css編集)」で修正する方法を書いていきます
DAZNはFire TV Stick等に対応しています
パソコンと同じアカウントを使って大画面テレビで視聴できるので、毎回パソコンでcss調整するのが面倒な場合は、これも検討してみてください
先に少し注意点
先に注意点をいくつか
◆ 一つ目：前提
(1) 一番大事なところで、今回は「ライブ配信」＆「FanZone」が前提
右側に「FanZone」とか「メンバー」「スタッツ」がある画面ですね
(2) 「シアターモード」有効でも、左右に黒い余白ができて、再生画面がウィンドウサイズまで大きくならない、という状態の対策をしていきます
(3) そして、今現在の修正案になります。
※ DAZNは結構変えるので、すぐに仕様変更によって内容が変わる可能性あります。
申し訳ないけれど、ご了承ください
◆ 二つ目：一時的なだけ
これから書くやり方は、一時的に変更して見え方を変えてるだけです
あくまで「見せかけるだけ」なので注意
何か間違えて設定しても、ページ更新(F5)したら元に戻るので、安心してください
逆に、「設定が保存されるわけではない」ので、設定はすぐ戻ってしまいます
毎回は手間だと思うので、集中したい試合だけ！とか必要な時だけおすすめします
◆ 三つ目：アドバイス＆シェアOK
自分の環境でだけなので、他により良いやり方があるかも
ここのコメント欄はメールアドレス不要なので、ユーザー名「匿名」にでもして、アドバイスお願いします
SNSシェアもOKです
役に立った場合は、SNSなどでシェアしてもらえると嬉しいです
再生画面をウィンドウサイズに広げる方法
てことで、実際に方法を書いていきます
◆ ブラウザ
Chromeのデベロッパーツールを使います。EdgeでもFirefoxでも開発者ツールという似た機能があるので、そこらへんは各自で確認してください
【手順】
◆１．DAZNで見たい試合を開く
◆２．再生画面右下の「シアターモード」を有効にする
＝つまり、「FanZone」「メンバー」「スタッツ」とかのタブを折りたたむ
◆３．再生画面の左右の黒帯(余白)の部分で右クリック(下の黄色部)→ メニューから「検証」を選択
◆４．「DevTools」というウィンドウが開く
おそらく
「div class=main__video-section___176fe undefined” style」
等と書かれた場所に飛ぶはず（数字とかは人によって違うかも）
このリストを開く（横▼をクリックすると、下に開く）
◆５．今回は、開いて一つ下に現れたところを使う
自分の環境なので全く同じ表示になるかわからないけど、似たような文字があるはず
ここをクリック（ちなみに、結構長い）
↓↓こんな表示↓↓
<section data-target=”player-layout” data-player-layout-displayed=”true” class=”main__player-layout___32auo main__player-layout-with-panel___2zrYN main__multi-view-player-layout___3ny8l”>
◆６．次は右側部分を使う
右側のタブが「スタイル」になっていること
この中で、以下の文字を探す
上から３ブロック目くらいにはあるはず
↓↓こんな表示↓↓
.main__player-layout-with-panel___2zrYN
width: 62.84722vw; （←これを直す ）
◆７．「width: 62.84722vw;」をダブルクリック。
数字部分を「100%」に値を変える
※ 注意：ちゃんと半角で変えること。変更後に取り消し線「100%」になってたらダメ
◆変更前
.main__player-layout-with-panel___2zrYN{
width: 62.84722vw;
}
◆変更後
.main__player-layout-with-panel___2zrYN{
width: 100%;
}
→この時点で、やりたいことの95%はできてるはず
ここからは微調整したい人だけでOK
（左右の少し余ってるところの調整）
◆８．もう一度、最初の項目に戻る
「div class=main__video-section___176fe undefined” style」
◆９．右側「スタイル」タブの上部にある「.main__video-section___176fe」の以下２つを、ちょうどいい感じに修正する
→いい感じ。というのはたぶん環境によって違うので、好きなように数字を変えてください。
私の環境では、左側が0px、右側が40pxがいい感じでした
↓↓この２つ↓↓
padding-left: 64px;
padding-right:64px;
◆変更前
.main__video-section___176fe {
padding-left: 64px;
padding-right:64px;
..略..
}
◆変更後
.main__video-section___176fe {
padding-left: 0px;
padding-right:40px;
..略..
}
DAZNはFire TV Stickなどにも対応しています。
パソコンと同じアカウントを使って大画面テレビで視聴できるので、毎回パソコンでcss調整するのが面倒な場合は、これも検討してみてください
おわりに
さてさて、どうだったでしょうか？
DAZNのライブ配信画面で左右に黒帯が出る場合に、再生画面をウィンドウサイズに一時的に広げる方法をかいてみました
実は以前も似た感じで、ウィンドウサイズにちょうどフィットしなくて、似たような記事を書いていて。
その時も書いていたんだけど、DAZNさん公式でこれを対応してくれればこんなことしなくてもいいんだよね。。。
というか、とりあえずあんなに有料でがっつりサブスク課金しているんだから、制限をせずに、ユーザーが好きなようにカスタマイズさえできる環境だけくれれば、それだけで評価は上がる気がするのだけれど。。。
どうしても、
「こっちが提案する環境で見てくれ！」
という押しつけがましさがみえるのは、なぜなのか。。。
難しいのかな！？と思うものの、
普通の動画配信サービスだとそんなことないから、たぶん強い意志があるんだろうね。。。
まぁ愚痴はいいか。。。
お願いします。DAZNさん。。。
最初にも書いたけれど、役に立ったら他の方にもSNSシェアなどよろしくです。
ぜひに、お試しください
コメント