Greasy Fork

Greasy Fork is available in English.

125论坛手机版优化

优化125论坛(bbs.125.la)在手机端的显示效果

当前为 2024-12-25 提交的版本,查看 最新版本

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name         125论坛手机版优化
// @namespace    http://tampermonkey.net/
// @version      1.6
// @description  优化125论坛(bbs.125.la)在手机端的显示效果
// @author       Your name
// @match        https://bbs.125.la/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // 检查是否为移动端访问
    if(!/mobile/i.test(navigator.userAgent)) return;

    // 修复视口设置
    function fixViewport() {
        document.querySelectorAll('meta[name="viewport"]').forEach(el => el.remove());
        const viewport = document.createElement('meta');
        viewport.name = 'viewport';
        viewport.content = 'width=device-width, initial-scale=1, maximum-scale=2, user-scalable=yes';
        document.head.appendChild(viewport);
    }

    // 重置基础布局单位 - 调整基础字体大小计算方式
    function setRootFontSize() {
        // 使用更大的基础字体大小,最小20px
        const baseFontSize = Math.max(screen.width * 0.045, 20);
        document.documentElement.style.fontSize = baseFontSize + 'px';
    }

    // 移除可能影响布局的样式
    function cleanupStyles() {
        const stylesToRemove = [
            'position: fixed',
            'position: absolute',
            'float',
            'transform',
            'zoom'
        ];

        const styleSheets = Array.from(document.styleSheets);
        styleSheets.forEach(sheet => {
            try {
                const rules = Array.from(sheet.cssRules || sheet.rules);
                rules.forEach(rule => {
                    if(rule.style) {
                        stylesToRemove.forEach(style => {
                            if(rule.style.cssText.includes(style)) {
                                rule.style.cssText = rule.style.cssText.replace(new RegExp(style + '[^;]+;', 'g'), '');
                            }
                        });
                    }
                });
            } catch(e) {
                // 跨域样式表会抛出错误,忽略即可
            }
        });
    }

    // 初始化
    function init() {
        fixViewport();
        setRootFontSize();
        cleanupStyles();

        // 监听屏幕旋转
        window.addEventListener('orientationchange', setRootFontSize);
    }

    // 修改自定义样式
    const customCSS = `
        /* 重置基础样式 */
        * {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
            font-size: 16px; /* 设置默认字体大小 */
        }

        /* 使用rem作为基础单位 */
        html {
            -webkit-text-size-adjust: 100%;
            text-size-adjust: 100%;
            font-size: 16px !important;
        }

        /* 基础布局容器 */
        body {
            width: 100%;
            max-width: 100vw;
            overflow-x: hidden;
            line-height: 1.5;
            font-size: 1.1rem !important;
        }

        /* 使用Grid布局重构页面结构 */
        .container {
            display: grid;
            grid-template-columns: 1fr;
            gap: 1rem;
            width: 100%;
            padding: 1rem;
            font-size: 1.1rem;
        }

        /* 列表项使用Flexbox布局 */
        .sub_forum li {
            display: flex;
            flex-direction: column;
            gap: 0.5rem;
            padding: 1rem;
            border-bottom: 1px solid rgba(0,0,0,0.1);
            font-size: 1.1rem;
        }

        /* 标题和信息使用Grid布局 */
        .forum_a {
            display: grid;
            grid-template-columns: 1fr auto;
            gap: 1rem;
            align-items: start;
            text-decoration: none;
            color: inherit;
            font-size: 1.1rem;
        }

        /* 文字溢出处理 */
        .thread_tit, h3 {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            grid-column: 1 / -1;
            font-size: 1.2rem !important;
            font-weight: bold;
            color: #333;
        }

        /* 统计信息使用Flexbox布局 */
        .f_count {
            display: flex;
            gap: 0.5rem;
            justify-content: flex-end;
            align-items: center;
            font-size: 1rem;
            color: #666;
        }

        /* 帖子标题 */
        h3 {
            font-size: 1.2rem !important;
            margin-bottom: 0.5rem;
        }

        /* 用户名和其他文字 */
        p, span, div {
            font-size: 1.1rem;
        }

        /* 链接文字 */
        a {
            font-size: 1.1rem;
            color: #333;
            text-decoration: none;
        }

        /* 确保所有文字都有合适的大小 */
        .sub_forum *, .container * {
            font-size: inherit;
        }
    `;

    // 插入样式
    const style = document.createElement('style');
    style.textContent = customCSS;
    document.head.appendChild(style);

    // 在DOM加载完成后初始化
    if(document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', init);
    } else {
        init();
    }

})();