您需要先安装一个扩展,例如 篡改猴、Greasemonkey 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 Userscripts ,之后才能安装此脚本。
您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。
您需要先安装用户脚本管理器扩展后才能安装此脚本。
Blendet Haupt- und Subnavigation auf MyDealz aus und fügt einen globalen Toggle-Button hinzu.
当前为
// ==UserScript== // @name MyDealz Global Nav Toggle // @namespace http://tampermonkey.net/ // @version 1.0 // @description Blendet Haupt- und Subnavigation auf MyDealz aus und fügt einen globalen Toggle-Button hinzu. // @author MD928835 // @match https://www.mydealz.de/* // @grant GM_addStyle // @grant GM_getValue // @grant GM_setValue // @license MIT // @run-at document-idle // ==/UserScript== (function() { 'use strict'; // --- Konfiguration --- const NAV_SELECTOR = '.nav'; // Hauptnavigationsleiste [1] const SUBNAV_SELECTOR = '.subNav--light'; // Sub-Navigationsleiste [1] // Container, in den der Button eingefügt wird (das <header>-Element selbst) const HEADER_SELECTOR = 'header[role="banner"].header'; const BUTTON_ID = 'mydealzGlobalNavToggle'; const STORAGE_KEY = 'mydealzGlobalNavVisible'; // Zustandsspeicherung const HIDDEN_CLASS = 'mydealz-nav-hidden-by-script'; // Eigene Klasse zum Ausblenden const ICON_BURGER = '☰'; const ICON_CLOSE = '✕'; // --- CSS hinzufügen --- GM_addStyle(` /* Klasse zum Ausblenden der Navigationsbereiche */ .${HIDDEN_CLASS} { display: none !important; /* Wichtig, um andere Styles zu überschreiben */ } /* Styling für den Toggle-Button */ #${BUTTON_ID} { position: fixed; /* Bleibt beim Scrollen sichtbar */ top: 8px; /* Abstand von oben */ left: 10px; /* Abstand von links */ z-index: 10001; /* Muss über anderen Elementen liegen (MyDealz hat z-index bis ~10000) */ background-color: rgba(240, 240, 240, 0.9); /* Leicht transparenter Hintergrund */ border: 1px solid #cccccc; border-radius: 5px; padding: 6px 12px; font-size: 22px; /* Größe des Icons */ line-height: 1; cursor: pointer; box-shadow: 0 2px 5px rgba(0,0,0,0.2); /* Kleiner Schatten */ transition: background-color 0.2s; } /* Hover-Effekt für den Button */ #${BUTTON_ID}:hover { background-color: rgba(220, 220, 220, 0.95); } `); // --- Elemente selektieren --- const navElement = document.querySelector(NAV_SELECTOR); const subNavElement = document.querySelector(SUBNAV_SELECTOR); const headerElement = document.querySelector(HEADER_SELECTOR); // Header für Button-Platzierung // --- Prüfen, ob kritische Elemente vorhanden sind --- // Das subNavElement ist optional (könnte auf manchen Seiten fehlen) if (!navElement || !headerElement) { console.error('MyDealz Global Nav Toggle: Hauptnavigation (.nav) oder Header (<header>) nicht gefunden. Skript wird beendet.'); return; } // --- Toggle-Button erstellen --- const toggleButton = document.createElement('button'); toggleButton.id = BUTTON_ID; toggleButton.title = "Navigation ein-/ausblenden"; // Icon wird in updateNavState gesetzt // --- Button einfügen --- // Fügt den Button als erstes Kind in das <header>-Element ein, // damit er außerhalb der Elemente liegt, die ausgeblendet werden. headerElement.prepend(toggleButton); // --- Zustand initialisieren (aus Speicher oder Standard = unsichtbar) --- let isVisible = GM_getValue(STORAGE_KEY, false); // --- Funktion zum Aktualisieren des Navigationszustands --- function updateNavState(visible) { // Hauptnavigation ein-/ausblenden navElement.classList.toggle(HIDDEN_CLASS, !visible); // Subnavigation ein-/ausblenden, falls vorhanden if (subNavElement) { subNavElement.classList.toggle(HIDDEN_CLASS, !visible); } // Button-Icon ändern toggleButton.textContent = visible ? ICON_CLOSE : ICON_BURGER; // Zustand speichern GM_setValue(STORAGE_KEY, visible); } // --- Initialen Zustand beim Laden setzen --- updateNavState(isVisible); // --- Event Listener für den Klick auf den Button hinzufügen --- toggleButton.addEventListener('click', () => { isVisible = !isVisible; // Zustand umschalten updateNavState(isVisible); // Anzeige aktualisieren und speichern }); })();