Stylus - ニコニコ動画(く) 動画再生ページ改善 HTML5版 公開中
閉じる
閉じる

新しい記事を投稿しました。シェアして読者に伝えましょう

×

Stylus - ニコニコ動画(く) 動画再生ページ改善 HTML5版 公開中

2016-12-24 22:18
  • 45
userstyles.org - ニコニコ動画(く) 動画再生ページ改善 HTML5版
最終更新日:2019/07/11

ニコニコ動画のHTML5版ページが使いにくいというあなたへ!

ページのレイアウト・デザインを変更して使い勝手を向上するスタイルシートを作ってみました。Chrome・Firefoxのアドオン「Stylus」をインストールし、このスタイルを適用することで、手軽にページを見やすくできます。ぜひ一度使ってみてください!

※StylusはStylishの派生版です。本家Stylishが使いづらくなってきたのでこちらをおすすめします。

こんな方におすすめ

  • 画面サイズ「中」だと小さすぎる!
  • コメント一覧が大きすぎて邪魔!
  • フルスクリーンでシークバーが邪魔!

対応確認済みブラウザ:Google Chrome 56, Firefox 50, Opera 42

ご意見ご要望等はこのブロマガにどうぞ。


特徴

横幅を1190pxに設定してレイアウト・デザインの気になるところを大幅改善。

半画面にしても無理なく動画を見られる!

全画面でコメント入力欄が邪魔にならない!


使い方

Stylusの導入

Stylusとは、指定ページのcssを上書きするためのアドオンです。Firefox・Google Chromeに対応しており、それぞれ以下のリンクから導入できます。

導入後は、ブラウザ右上に管理ボタンが表示されるので、そこからスタイルの適用・非適用、スタイルの削除・編集・新規作成、スタイルの検索等が行えます。

Google Chromeの場合

Stylus - Chrome ウェブストア
https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne

Firefoxの場合

Stylus – Firefox 向けアドオン
https://addons.mozilla.org/ja/firefox/addon/styl-us/

スタイルの導入

以下のページから Install Style のボタンを押すことで、スタイルの導入が出来ます。

userstyles.org - ニコニコ動画(く) 動画再生ページ改善 HTML5版
https://userstyles.org/styles/135578

http://userstyles.org/ には、他にもニコ動用のスタイルを上げている方がおられるので、好みに合わせて使い分けてみてください。


スタイルの有効化/無効化・削除・編集

Stylus導入後は、ブラウザの右上にボタンが表示されます。ボタンをクリックると下のようなウィンドウが表示されます。

この画面でスタイルの有効化/無効化の削除の操作ができます。編集ボタンを押すことで、編集画面を開くことができます。スタイル一覧を見たいときは管理ボタンを押してください。

スタイルを適用して表示に問題があった場合は、まず無効化してみてください。


おまけ

コメ番のケタ数の増やし方(Chrome, Firefoxで確認)


広告
他35件のコメントを表示
×
>>38
NicoVideo Dark Themeとは編集箇所が競合しちゃってますね…
申し訳ないですが、こちらでは調整できません。
NicoVideo Dark Themeをベースに動画サイズの変更を求めるならば、あちらに要望を出していただくしかありません。
お力になれず申し訳ありません。
22ヶ月前
×
お久しぶりです。相変わらず本スタイルにはお世話になっております。

さて、本日のおそらくお昼ごろ、動画再生ページのレイアウトに告知もなく変更があったようです。
具体的にはコメント欄の部分に「動画リスト」なる機能が追加されております。

相変わらずお願いばかりで本当に心苦しいのですが、今回のアップデートによりコメント欄が動画に被さってしまうという事態が発生しております。
もし対応いただけましたら本当に幸いです。よろしくお願い致します。
15ヶ月前
×
>>40 るきあ様
コメントのおかげで仕様変更に気づきました、ありがとうございます。
「動画リスト」の導入と、それにあわせてクラスの割り当てに少し変更があったようで、コメント欄が動画にかぶってしまっているのを確認しました。
その辺りの修正や、動画リストへの対応をしてみましたので、更新してみてください。

また、「サイズ:自動」で画面幅が狭くなった時にコメント一覧を下側右に表示するように変更してみました。(主に自分の要望を反映)

また何かありましたらお気軽にコメントください。
15ヶ月前
×
ご対応いただきありがとうございます!やっぱり動画説明欄に枠が付いていないと落ち着かなくていけません。

ただ、本当に申し訳ないのですが、もう2点お伺いしたい点がございます。現在、以下の現象を確認しております。
1. コメント欄の「再生時間、書き込み時間、コメ番」といった表記が、コメント欄の外、右側にずれる。
2.当スタイルシートを適用した状態でのみ、画面サイズが通常よりも大きくなってしまう。
これらの現象は自分の環境でのみ発生しているのかもしれません。もし何かしらの対処方法がありましたら、教えていただけますと幸いです。
15ヶ月前
×
大変ありがたく利用させていただいております。
仕様変更の対応も大変ありがたいのですが、コメントの自動スクロール設定やNG設定が消えてしまって使用できなくなってしまっています。
また、るきあ様の1の症状も出ております。恐縮ですが対応いただけたら幸いです。
15ヶ月前
×
オリジナルの全画面は縦横どちらか小さい方に画面サイズを合わせていますが、このスタイルでは横サイズのみに合わせているので、横長全画面の時に画面下が切れてしまいます。
15ヶ月前
×
>>42
1.「再生時間、書き込み時間、コメ番がコメント欄の外にずれる」
Firefoxにてレイアウトが崩れているのを確認していました。Chromeでしか動作確認していなかったことが原因ですね。修正しました。

2.「画面サイズが通常より大きくなってしまう」
幅1590px以下では画面幅いっぱいに表示されるようにしていました。確かにこれだと幅1600px以下の環境では違和感があったので、幅1200pxまでは画面幅の90%で表示するように変更しました。

>>43
ご利用ありがとうございます。
自動するクロールやNG設定のボタンが隠れてしまう現象はFirefoxで確認しました。これについても修正しました。

以上の件について、修正したものをアップロードしておきましたので、更新してみてください。
15ヶ月前
×
>>45 Mac3さま
「ウィンドウが横長時に画面下が見切れる」
これについては意図的にやっていました。しかし、ニコ動の元の仕様やYoutubeの仕様を見るに、縦幅にも合わせるほうが全体的なニーズに沿っていそうですね。今から手を付けてみます。
15ヶ月前
×
>>45 >>47 Mac3さま
「ウィンドウが横長時に画面下が見切れる」問題に対処しました。動画枠がウィンドウの幅だけでなく高さに応じて縮小するように変更しました。こんな感じでよろしいでしょうか?
15ヶ月前
×
お世話になっております。

本日、アップデートされたスタイルを試してみたところ、幾つかの表記がコメント欄外にずれる問題が解消されていました!
ご対応いただきありがとうございます。

画面サイズは自分にとってはまだ多少大きかったのですが、これは自分がニコニコを使用する際、フォントの大きさ等の都合でブラウザの倍率を133%にしていたためだったようです。
ブラウザ倍率を120%にしたところ、(フォントの大きさも含め)問題ないサイズとなりました。
今後共お世話になります。ありがとうございました!
15ヶ月前
コメントを書く
コメントをするには、
ログインして下さい。