Greasy Fork

Greasy Fork is available in English.

隐藏抖音顶左栏

2023/6/12 19:20:21

目前为 2024-04-14 提交的版本，查看 最新版本。

// ==UserScript==
// @name        隐藏抖音顶左栏
// @namespace   鼠标显示隐藏抖音header搜索和左侧栏
// @match       https://www.douyin.com/*
// @namespace   476321082
// @license      MIT
// @grant       none
// @version     0.9.1
// @author      -
// @description 2023/6/12 19:20:21
// ==/UserScript==

(function() {
    'use strict';

    // 获取顶栏元素
    var header = document.getElementById("douyin-header");

    // 获取第三个div元素
    var target = document.querySelector(".windows-os > :nth-child(3)").firstElementChild;

    // 创建一个包含两个按钮的容器元素
    var container = document.createElement("div");
    container.style.position = "fixed";
    container.style.right = "0px";
    container.style.top = "300px"; // 往下移动60px
    container.style.zIndex = "9999";

    // 创建显示按钮
    var showBtn = document.createElement("button");
    showBtn.innerText = "显示";

    // 创建隐藏按钮
    var hideBtn = document.createElement("button");
    hideBtn.innerText = "隐藏";

    // 设置两个按钮的样式和间距
    var btnStyle = "display: block; margin: 5px;"; // 上下间距10px，换行显示
    showBtn.style.cssText = btnStyle;
    hideBtn.style.cssText = btnStyle;

    // 修改按钮的背景色和字体颜色
    showBtn.style.backgroundColor = "black";
    showBtn.style.color = "gray";
    hideBtn.style.backgroundColor = "black";
    hideBtn.style.color = "gray";

    // 修改按钮的大小
    showBtn.style.width = "60px"; // 宽度60px
    showBtn.style.height = "30px"; // 高度30px
    hideBtn.style.width = "60px"; // 宽度60px
    hideBtn.style.height = "30px"; // 高度30px

    // 添加两个按钮到容器元素
    container.appendChild(showBtn);
    container.appendChild(hideBtn);

    // 添加容器元素到页面
    document.body.appendChild(container);

    // 定义显示和隐藏顶栏和第三个div的函数
    function showElements() {
        header.style.display = "block"; // 显示顶栏
        target.style.display = "block"; // 显示第三个div
    }
    function hideElements() {
        header.style.display = "none"; // 隐藏顶栏
        target.style.display = "none"; // 隐藏第三个div
    }

    // 给两个按钮添加点击和移入事件
    showBtn.addEventListener("click", showElements);
    showBtn.addEventListener("mouseover", showElements);
    hideBtn.addEventListener("click", hideElements);
    hideBtn.addEventListener("mouseover", hideElements);
})();