主題

Tampermonkey腳本自定義 netflix 字幕字體大小腳本

肉粽 | 2024-06-19 16:18:09 | 巴幣 0 | 人氣 78

// ==UserScript==
// @name Netflix 字幕調整
// @namespace http://tampermonkey.net/
// @version 2.0
// @description  改變 Netflix 字幕字體大小
// @author       RouZong
// @match        *://*.netflix.com/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    function changeSubtitleSize() {
        const height = window.innerHeight;
        const fontSize = height * 0.037; // 1080 高度時字體大小約為 40px
        const subtitles = document.querySelectorAll('.player-timedtext-text-container span span');
        subtitles.forEach(subtitle => {
            subtitle.style.fontSize = `${fontSize}px`; // 設置比例字體大小
            subtitle.style.textAlign = 'center';
            subtitle.style.display = 'inline-block';
        });

        const subtitleContainers = document.querySelectorAll('.player-timedtext-text-container');
        subtitleContainers.forEach(container => {
            container.style.textAlign = 'center';
            container.style.left = '50%';
            container.style.transform = 'translateX(-50%)';
        });
    }

    // MutationObserver 用於監聽 DOM 變化
    const observer = new MutationObserver((mutationsList) => {
        for(let mutation of mutationsList) {
            if (mutation.type === 'childList') {
                changeSubtitleSize();
            }
        }
    });

    // 開始觀察目標節點，配置參數：子節點變動
    const targetNode = document.body;
    const config = { childList: true, subtree: true };

    observer.observe(targetNode, config);

    // 初次運行時調整一次字體大小
    changeSubtitleSize();

    // 監聽視窗大小變化事件，動態調整字體大小
    window.addEventListener('resize', changeSubtitleSize);
})();

更新日誌：

v2.0 2024-06-24

改成隨視窗比例高度調整可自行調整比例

目前是我自己覺得1080高度下可以產生約40px大小的字幕

v1.1 2024-06-22

增加上方字幕支持(原先沒考慮到)

v1.0 2024-06-19

可自定義字幕大小