// ==UserScript==
// @name 自定义字体渲染
// @namespace http://tampermonkey.net/
// @version 1.0
// @description 自定义网页上的字体渲染效果。
// @author Your name
// @match *://*/*
// @grant GM_getValue
// @grant GM_setValue
// @downloadURL https://update.greasyfork.icu/scripts/491771/%E8%87%AA%E5%AE%9A%E4%B9%89%E5%AD%97%E4%BD%93%E6%B8%B2%E6%9F%93.user.js
// @updateURL https://update.greasyfork.icu/scripts/491771/%E8%87%AA%E5%AE%9A%E4%B9%89%E5%AD%97%E4%BD%93%E6%B8%B2%E6%9F%93.meta.js
// ==/UserScript==
(function() {
'use strict';
// 创建用户界面元素
var uiContainer = document.createElement('div');
uiContainer.id = 'fontRendererUI';
uiContainer.style.position = 'fixed';
uiContainer.style.bottom = '20px';
uiContainer.style.right = '20px';
uiContainer.style.backgroundColor = '#333'; // Dark background color
uiContainer.style.color = '#fff'; // White text color
uiContainer.style.padding = '10px';
uiContainer.style.border = '1px solid #ccc';
uiContainer.style.borderRadius = '5px';
uiContainer.innerHTML = `
×
自定义字体渲染设置
`;
document.body.appendChild(uiContainer);
// Apply button click event listener
document.getElementById('applyButton').addEventListener('click', applyFontStyles);
// Font styles function
function applyFontStyles() {
var fontSize = document.getElementById('fontSize').value;
var fontColor = document.getElementById('fontColor').value;
var bgColor = document.getElementById('bgColor').value;
var fontFamily = document.getElementById('fontFamily').value;
var lineHeight = document.getElementById('lineHeight').value;
var letterSpacing = document.getElementById('letterSpacing').value;
var textShadow = document.getElementById('textShadow').value;
var fontWeight = document.getElementById('fontWeight').value;
var textDecoration = document.getElementById('textDecoration').value;
var textAlign = document.getElementById('textAlign').value;
var textTransform = document.getElementById('textTransform').value;
var textIndent = document.getElementById('textIndent').value;
var wordSpacing = document.getElementById('wordSpacing').value;
var textAlignLast = document.getElementById('textAlignLast').value;
var wordBreak = document.getElementById('wordBreak').value;
var whiteSpace = document.getElementById('whiteSpace').value;
var overflow = document.getElementById('overflow').value;
var transform = document.getElementById('transform').value;
var visibility = document.getElementById('visibility').value;
var cursor = document.getElementById('cursor').value;
var zIndex = document.getElementById('zIndex').value;
var styles = `
font-size: ${fontSize}px;
color: ${fontColor};
background-color: ${bgColor};
font-family: ${fontFamily};
line-height: ${lineHeight};
letter-spacing: ${letterSpacing}em;
text-shadow: ${textShadow};
font-weight: ${fontWeight};
text-decoration: ${textDecoration};
text-align: ${textAlign};
text-transform: ${textTransform};
text-indent: ${textIndent}px;
word-spacing: ${wordSpacing}px;
text-align-last: ${textAlignLast};
word-break: ${wordBreak};
white-space: ${whiteSpace};
overflow: ${overflow};
transform: ${transform};
visibility: ${visibility};
cursor: ${cursor};
z-index: ${zIndex};
`;
// Apply styles to all text elements on the page
var textElements = document.querySelectorAll('p, span, h1, h2, h3, h4, h5, h6, a, div, li, td, th');
textElements.forEach(function(elem) {
elem.style.cssText = styles;
});
// Save styles to GM storage
GM_setValue('fontSize', fontSize);
GM_setValue('fontColor', fontColor);
GM_setValue('bgColor', bgColor);
GM_setValue('fontFamily', fontFamily);
GM_setValue('lineHeight', lineHeight);
GM_setValue('letterSpacing', letterSpacing);
GM_setValue('textShadow', textShadow);
GM_setValue('fontWeight', fontWeight);
GM_setValue('textDecoration', textDecoration);
GM_setValue('textAlign', textAlign);
GM_setValue('textTransform', textTransform);
GM_setValue('textIndent', textIndent);
GM_setValue('wordSpacing', wordSpacing);
GM_setValue('textAlignLast', textAlignLast);
GM_setValue('wordBreak', wordBreak);
GM_setValue('whiteSpace', whiteSpace);
GM_setValue('overflow', overflow);
GM_setValue('transform', transform);
GM_setValue('visibility', visibility);
GM_setValue('cursor', cursor);
GM_setValue('zIndex', zIndex);
}
// Close button click event listener
document.getElementById('closeButton').addEventListener('click', function() {
uiContainer.style.display = 'none';
});
// Drag and drop functionality
var isDragging = false;
var initialX;
var initialY;
var offsetX = 0;
var offsetY = 0;
uiContainer.querySelector('h2').addEventListener('mousedown', function(e) {
isDragging = true;
initialX = e.clientX - offsetX;
initialY = e.clientY - offsetY;
});
document.addEventListener('mousemove', function(e) {
if (isDragging) {
offsetX = e.clientX - initialX;
offsetY = e.clientY - initialY;
uiContainer.style.left = offsetX + 'px';
uiContainer.style.top = offsetY + 'px';
}
});
document.addEventListener('mouseup', function() {
isDragging = false;
});
})();