YouTube を左右反転や回転して観る方法

YouTube の動画の向きを変えて観たい場合があります。
振り付けを覚えたいので左右反転（鏡像反転）して観たいとか、撮影者が縦撮りして画面の天地が横倒しになったままアップされている動画を回転補正して観たいとか、まあいろいろですね。
軽く探してみましたが、動画をダウンロードして動画再生アプリの機能で補正して観る、という方法が多かったです。DL して観るのが習慣という人は、まあそれでもいいかもしれませんが、どっちかというと YouTube のサイト上で観る人の方が多くないですかね？　少なくとも自分は、そうです。
そんなわけで、YouTube のサイト上で左右反転や回転して見る方法を調べてみました。

簡単に言うと、HTML5 対応ブラウザであれば向きは CSS で制御できるので、後は CSS をカスタマイズできるアドオンを利用するといいよ、ということです。これで分かる方は、以後読まなくていいです。
ここでは、ブラウザ Firefox と Stylish アドオンの組み合わせで説明しますが、Google Chrome と Stylish エクステンションとか、Safari と Stylish for Safari 機能拡張でも基本は一緒のはずです。

前提条件

• ブラウザ Firefox
• Stylish アドオン
• YouTube HTML5 動画プレーヤーを有効にしていること

手順

1. Firefox に Stylish アドオンをインストールします。

2. Firefox の [アドオン] メニューを選び、[ユーザースタイル] をクリック、[新しいスタイルを書く] ボタンをクリックします。

3. 以下のような CSS を貼り付け、自分に分かりやすい名前を付けて保存します。

@namespace url(http://www.w3.org/1999/xhtml);

/*左右反転*/
@-moz-document 
url-prefix("https://www.youtube.com/watch?v=UGP_hoQpLZQ")  /* [PV] Perfume 「レーザービーム」 2011.5.18発売！ */
,url-prefix("https://www.youtube.com/watch?v=tcnTOwZj7D0")  /* [PV]　Perfumeニューシングル 「ねぇ」 2010.11.10発売！  */
{
video.video-stream{-moz-transform: scaleX(-1);}
}

/* 90度回転（動画の天地が左右になっている状態を補正）*/
@-moz-document 
url-prefix("https://www.youtube.com/watch?v=5mKizJ5rXgA")  /* 微かなカオリ 縦型PV */
{
video.video-stream{-moz-transform: rotate(90deg) scale(0.6);}
}

/* -90度回転（動画の天地が右左になっている状態を補正）*/
@-moz-document 
url-prefix("https://www.youtube.com/watch?v=PI4q8Iol-S4")  /* HALLS ラブプラス 姉ヶ崎寧々 〔縦撮り〕*/
{
video.video-stream{-moz-transform: rotate(-90deg) scale(0.6);}
}

以上で、目的の URL にアクセスすると Stylish が自動的に動画を回転/反転補正して再生してくれます。
設定の切り替えや編集は、アドオンバーからも簡単に行えます。

使用前。

使用後（-90度回転）。

もうひとつ、使用前。

使用後（左右反転）。

注意点としては、YouTube の新機能ページにも書いてあるとおり、すべての動画でこの方法が使えるわけではありません（広告付き動画などは非対応）。また Stylish の制限により、URL は完全一致です（url-prefix ルールの場合は前方完全一致）。ワイルドカード文字は使えません。つまり "https://" で記述したら、"http://" にはマッチしませんし、"youtube.com" と "youtu.be" を同一扱いにもしてくれません。いろいろな形式の URL でアクセスする可能性がある場合は、全候補を併記する必要があります。
HTTPS Everywhere アドオンを入れておくと、常に https でアクセスするようになるので、多少問題は軽減します (https だけ書けば良い)。
あと、transform 系の CSS スタイル名は（今のところ）UA によって異なるので、Firefox 以外の場合は各自で調べてください。

Stylish アドオンというと、CSS ガシガシいじってデザインを変えるイメージがあったので、デザインセンスゼロの自分とは、無縁のアドオンだと思っていましたが、こんな風にピンポイントで使っても大きく意味のある変更ができるとなると、実は万人にお勧めのアドオンと言えるのかもしれません。
いろいろと踊ってみたい人や、あるいはノートPCを床に置いて、横に寝転がって動画を見たいとき（ domain(www.youtube.com) と書くと、サイト全部に適用）などに、ぜひお試しください。

え、IE ユーザー？　さあ、自分使ってないので、どうすればいいのか分かりませんね…。