FB 停用重播、解除靜音、增加可點擊的進度條

停用重播、解除靜音、增加可點擊的進度條
目前為 2025-06-08 提交的版本，檢視最新版本。
安裝腳本 ?
換行
// ==UserScript==
// @name         FB 停用重播、解除靜音、增加可點擊的進度條
// @namespace    http://tampermonkey.net/
// @version      2025-06-09
// @description  停用重播、解除靜音、增加可點擊的進度條
// @author       shanlan(ChatGPT o3-mini)
// @match        *://www.facebook.com/*
// @grant        none
// @run-at       document-end
// @license MIT
// ==/UserScript==

(function() {
'use strict';

const addOverlay = video => {
if(video._ov) return;
const ov = document.createElement('div');
ov.style.cssText = "position:fixed; background:transparent; z-index:1000000; pointer-events:auto;";
document.body.appendChild(ov);
video._ov = ov;

const prog = document.createElement('div');
prog.style.cssText = "height:100%; width:0%; background:#f00;";
ov.appendChild(prog);

// 利用 requestAnimationFrame 持續更新覆蓋層位置
const update = () => {
const r = video.getBoundingClientRect();
ov.style.left = r.left + "px";
ov.style.top = (r.bottom - 8) + "px";
ov.style.width = r.width + "px";
ov.style.height = "8px";
requestAnimationFrame(update);
};
requestAnimationFrame(update);

// 進度條更新
video.addEventListener('timeupdate', ()=> {
if(video.duration) prog.style.width = (video.currentTime/video.duration*100) + '%';
});

// 點擊事件：根據點擊位置調整播放進度
ov.addEventListener('pointerdown', e => {
e.preventDefault();
e.stopPropagation();
const r = ov.getBoundingClientRect();
const pct = (e.clientX - r.left) / r.width;
if(video.duration) video.currentTime = video.duration * pct;
}, true);
};

const enhance = video => {
if(video._enhanced) return;
video._enhanced = 1;
video.loop = false;
video.addEventListener('ended', ()=> {
video.pause();
video.currentTime = video.duration;
});
video.addEventListener('canplay', function unmute(){
video.muted = false;
video.volume = 1;
video.removeEventListener('canplay', unmute);
});
addOverlay(video);
};

const scan = node => {
if(!node) return;
if(node.nodeName === 'VIDEO') enhance(node);
else node.querySelectorAll?.('video').forEach(enhance);
};

new MutationObserver(muts => {
muts.forEach(m => m.addedNodes.forEach(scan));
}).observe(document.body, {childList:true, subtree:true});

document.querySelectorAll('video').forEach(enhance);
})();
欢迎访问Greasy Fork镜像
