本帖最後由 狗中之霸王狗 於 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)
登录 后参与讨论。
还没有评论,来抢沙发吧。