Youtubeの動画やライブを回転させて観る方法

外部ツールなどを使わず、F12キーの開発者ツールを用いて、Youtube上で

動画を回転させて見るための方法です。

Microsoft Edgeを使用して行っていますが、他のブラウザでも同様の方法で可能だと思います。

動画の場合

１、回転させたい動画を開いた状態でF12キーもしくは右クリックから（開発者ツール）を開く

２、要素の検証（左上 もしくは Ctrl + Shift + C）を使用して、動画部分をクリック

３、スタイル項目欄から

element.style {
    width: 640px;
    height: 360px;
    left: 0px;
    top: 0px;
}

ここをクリックし、以下の要素を追加する

transform: rotate(数値deg);

-値は時計回りに回転
例:

//右に90度回転
transform: rotate(90deg);
//左に90度回転
transform: rotate(-90deg);
//逆さま
transform: rotate(180deg);

ライブの場合

１，２までは動画の方法と同じで書き込む場所を変えるだけ、

３、element.styleの下にある、

.html5-video-player .video-click-tracking, .html5-video-player .video-stream {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
}

ここに上と同じ要素を追加する。

.html5-video-player .video-click-tracking, .html5-video-player .video-stream {
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    transform: rotate(-90deg);
}

おまけ

実用性はないが上下反転左右反転も同じように行える。

左右反転

transform: scaleX(-1);

上下反転

transform: scaleY(-1);