一个小小脚本,去除Linux顶部标题

在公司摸鱼不是很方便,每次打开一个帖子顶部一个大大的标题,现学现卖,废九牛二虎写了一个油猴脚本,一打开帖子就把顶部隐藏,这下放心多了

this.$ = this.jQuery = jQuery.noConflict(true);
// ==UserScript==
// @name         LinuxDo
// @namespace    http://tampermonkey.net/
// @version      2024-11-25
// @description  ⚡️去除LinuxDo头部大标题⚡️
// @require      http://libs.baidu.com/jquery/2.0.0/jquery.min.js
// @require      https://cdn.tailwindcss.com
// @author       You
// @match        *://*.linux.do/*
// @run-at       document-start
// @icon         https://www.google.com/s2/favicons?sz=64&domain=linux.do
// @grant        none
// ==/UserScript==

(function () {
    'use strict';

    $(function () {

        class LinuxDo {

            ButtonCallback = {
                "hide-title": this.HideTopTitle
            }
            UserStyleId    = "user-style";

            constructor() {
                this.CreateCssStyle()
            }

            CreateCssStyle(css = "") {
                let userStyle = $(this.UserStyleId);
                if (userStyle.length > 0) {
                    userStyle.append(css);
                    return;
                }
                const style = $('<style>');
                style.text(css);
                style.attr("id", this.UserStyleId);
                $('head').append(style);
            }

            HideTopTitle(dataType, hide = true) {
                localStorage.setItem(dataType, hide.toString());
                if (hide) {
                    this.CreateCssStyle(".title-wrapper  span[dir='auto']{display:none !important}");
                    return
                }
                this.CreateCssStyle(".title-wrapper  span[dir='auto']{display:block !important}");
            }


            Run() {
                this.UserDesktop();
                this.Init();
            }

            Init() {
                Object.entries(this.ButtonCallback).forEach(([key, value]) => {
                    const checked = (localStorage.getItem(key) || null) === "true";
                    this.ButtonCallback[key]?.call(this, key, checked);
                    $(`input[data-type=${key}]`).prop("checked", checked);
                });
            }

            UserDesktop() {
                const userPanel = $(`<div class="box-border w-[150px] fixed top-[88px] right-[15px] flex flex-col justify-around border border-solid border-black rounded-[5px]">
                    <div class="p-[5px] flex flex-row justify-between">
                        <label class="form-control flex items-center gap-1">
                            <input type="checkbox" class="switch" data-type="hide-title"/>
                            <span class="label cursor-pointer flex-col items-start">
                            <span class="text-base-content/90 text-[#1e9fff] font-normal">隐藏顶部标题</span>
                        </span>
                        </label>
                    </div>
                    <div class="p-[5px] flex flex-row justify-between">
                        <label class="form-control flex items-center gap-1">
                            <input type="checkbox" class="switch" data-type="other"/>
                            <span class="label cursor-pointer flex-col items-start">
                            <span class="text-base-content/90 text-[#1e9fff] font-normal">其他功能</span>
                        </span>
                        </label>
                    </div>
               </div>`);

                let Instans = this;
                $(userPanel).on("click", ".switch", function () {
                    let dataType = $(this).attr("data-type");
                    let callback = Instans.ButtonCallback[dataType] || null;
                    if (!callback) {
                        return;
                    }
                    let checked = $(this).is(":checked");
                    if (checked) {
                        callback.call(Instans, dataType, true)
                        return;
                    }
                    callback.call(Instans, dataType, false)
                });
                $("body").append(userPanel);
            }
        }

        let app = new LinuxDo();
        app.Run()
    });
})();
15 个赞

感谢分享大佬厉害啊

不是佬 这个都会啦

感谢大佬分享 !

感谢分享大佬厉害啊

1 个赞

感谢你的分享!

1 个赞

搞七捻三, Lv1开发调优

油猴脚本, #软件开发添加#快问快答移除

这个实用,每次被这个标题搞的好尴尬

哈哈 还有什么小需求 可以提出来 我继续完善

看来这位佬还不知道咱佬强大的插件么。I guess this guy doesn’t know about our powerful plug-ins. @anghunk
linuxdo 增强插件,持续更新欢迎反馈 - 资源荟萃 - LINUX DO

5 个赞

还别说,这个需求我还真的就是需要,mark。

不早说 我就不自己写了啊

1 个赞

这不你又学习了一点点,强得嘞。It’s not like you’re learning a little bit more, it’s strong.tieba_007

你知道我有多难吗 写个UI界面 没有那种直接引入就能用的组件 全是npm 看了我就麻 我累的呀 有没有直接引入就能用的ui组件来一个

好插件!另外可以在主楼放个效果图

image
丑的一匹,但是能用

this.$ = this.jQuery = jQuery.noConflict(true);
// ==UserScript==
// @name         LinuxDo去除标题
// @namespace    http://tampermonkey.net/
// @version      2024-11-25
// @description  ⚡️去除LinuxDo头部大标题⚡️
// @require      http://libs.baidu.com/jquery/2.0.0/jquery.min.js
// @require      https://cdn.tailwindcss.com
// @author       You
// @match        *://*.linux.do/*
// @run-at       document-start
// @icon         https://www.google.com/s2/favicons?sz=64&domain=linux.do
// @grant        none
// ==/UserScript==

(function () {
    'use strict';

    $(function () {
        class LinuxDo {
            constructor() {
                this.CreateCssStyle();
                this.HideTopTitle();
            }

            CreateCssStyle(css = "") {
                let userStyle = $("#user-style");
                if (userStyle.length > 0) {
                    userStyle.append(css);
                    return;
                }
                const style = $('<style>');
                style.text(css);
                style.attr("id", "user-style");
                $('head').append(style);
            }

            HideTopTitle() {
                this.CreateCssStyle(".title-wrapper span[dir='auto']{display:none !important}");
            }
        }

        let app = new LinuxDo();
    });
})();

直接这样就好了,不用特意设置一个按钮区域遮挡内容,想用的可以使用油猴进行开关处理

2 个赞

完美​​​​​​​​

好好好,可以可以