成人交流 · text · 0 分 · 评论 0 · 阅读 5

写了一个放大预览图的脚本,分享给各位

本帖最後由 狗中之霸王狗 於 2025-7-8 03:12 編輯

在内容页面中,“樣品圖像”下面的预览图无法放大,影响预览体验,所以专门搞了个油猴脚本,可以通过鼠标滚轮对预览图进行缩放,欢迎体验。

说明:仅针对 javbus.com 域名下使用,其他备用地址不支持。

代码如下:
// ==UserScript==
// @name         JavBus 预览图缩放
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  通过鼠标滚轮进行预览图缩放
// @match        https://www.javbus.com/*
// @exclude      https://www.javbus.com/forum/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    const observer = new MutationObserver((mutations) => {
        mutations.forEach((mutation) => {
            mutation.addedNodes.forEach((node) => {
                if (node.nodeType === 1) {
                    const img = node.querySelector('img[src*="pics.dmm.co.jp/"]');
                    if (img) {
                        enhanceImagePopup(img, node);
                    }
                }
            });
        });
    });

    observer.observe(document.body, { childList: true, subtree: true });

    function enhanceImagePopup(img, overlay) {
        const initialWidth  = img.clientWidth;
        const initialHeight = img.clientHeight;

        overlay.style.cursor = 'pointer';
        overlay.addEventListener('click', (e) => {
            if (e.target === overlay) {
                overlay.remove();
            }
        });

        const bottomBar = document.querySelector('.mfp-bottom-bar');

        let scale = 1;
        img.style.transformOrigin = 'center center';
        img.style.transform = 'scale(1)';
        img.style.transition = 'transform 0.2s';
        let isZoomed = false;

        overlay.addEventListener('wheel', (e) => {
            e.preventDefault();

            scale += e.deltaY * -0.001;

            const minScaleByWidth  = initialWidth  / img.clientWidth;
            const minScaleByHeight = initialHeight / img.clientHeight;
            const minScale = Math.max(minScaleByWidth, minScaleByHeight, 1);
            scale = Math.max(scale, minScale);

            img.style.transform = `scale(${scale})`;

            if (!isZoomed && bottomBar) {
                bottomBar.style.display = 'none';
                isZoomed = true;
            }
        });
    }

    window.addEventListener('unload', () => {
        observer.disconnect();
    });
})();
複製代碼

评论 (0)

登录 后参与讨论。

还没有评论,来抢沙发吧。