横持ちでフルスクリーン

Automatically enter fullscreen mode for videos when device is in landscape orientation
目前为 2025-04-03 提交的版本。查看最新版本。
Wrap lines
// ==UserScript==
// @name         横持ちでフルスクリーン
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Automatically enter fullscreen mode for videos when device is in landscape orientation
// @author       You
// @match        *://*/*
// @grant        none
// @license MIT
// @run-at       document-end
// ==/UserScript==

(function() {
    'use strict';

    // モバイルデバイス判定
    function isMobileDevice() {
        return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
    }

    // 疑似フルスクリーン用CSS
    function applyPseudoFullscreen(video) {
        video.style.position = 'fixed';
        video.style.top = '0';
        video.style.left = '0';
        video.style.width = '100vw';
        video.style.height = '100vh';
        video.style.objectFit = 'contain';
        video.style.backgroundColor = 'black';
        video.style.zIndex = '999999';
    }

    // オリエンテーション変更処理
    function handleOrientation() {
        if (!isMobileDevice()) return;

        const isLandscape = window.innerWidth > window.innerHeight;
        const videos = document.querySelectorAll('video');

        videos.forEach(video => {
            // iOS向け属性設定
            video.setAttribute('playsinline', 'true');
            video.setAttribute('controls', 'true');

            if (isLandscape) {
                // ネイティブフルスクリーンを試行
                if (video.requestFullscreen) {
                    video.requestFullscreen().catch(e => console.log(e));
                }
                // CSSでフォールバック
                applyPseudoFullscreen(video);
            } else {
                // スタイルリセット
                video.style.cssText = '';
            }
        });
    }

    // イベントリスナー登録
    window.addEventListener('resize', handleOrientation);
    handleOrientation(); // 初期実行

    // 動画動的検出用MutationObserver
    new MutationObserver(handleOrientation).observe(document.body, {
        childList: true,
        subtree: true
    });
})();
欢迎访问Greasy Fork镜像
