Tampermonkey: показать элемент, если он скрыт (и наоборот) - PullRequest
Новая
       6

Tampermonkey: показать элемент, если он скрыт (и наоборот)

0 голосов
/ 06 октября 2019

Я хотел бы скрыть / показать некоторые элементы Div на Youtube на основе сочетания клавиш. Я могу скрыть div, но не отображать их, как только спрятал их. 

// ==UserScript==
// @name         Youtube enhanced
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Youtube enhanced
// @author       You
// @include     *youtube.com/watch*
// for change CSS
// @grant    GM_addStyle

// ==/UserScript==


window.addEventListener("keydown", dispatchkeyboard, false);

function dispatchkeyboard(key) {
    // frontcolor

    if (key.altKey && key.code === "KeyC") { // KeyX
        alert("c")
        var hidden_or_display = document.getElementsByClassName("ytp-gradient-bottom")[0].style.display;
        alert(hidden_or_display)
        if (hidden_or_display == "none") {
            alert('none')
            var display = ".ytp-gradient-bottom,.ytp-gradient-top,.ytp-chrome-top,.ytp-chrome-bottom{display:block;}"
            var tag = document.createElement("style");
            tag.type = "text/css";
            document.getElementsByTagName("head")[0].appendChild(tag);
            tag[(typeof document.body.style.WebkitAppearance == "string") ? "innerText" : "innerHTML"] = display
        } else {
            alert('else')
            var goaway = ".ytp-gradient-bottom,.ytp-gradient-top,.ytp-chrome-top,.ytp-chrome-bottom{display:none;}";
            var tagd = document.createElement("style");
            tagd.type = "text/css";
            document.getElementsByTagName("head")[0].appendChild(tagd);
            tagd[(typeof document.body.style.WebkitAppearance == "string") ? "innerText" : "innerHTML"] = goaway
        }
    }

}

1 Ответ

1 голос
/ 06 октября 2019

Встроенный стиль имеет больший приоритет над стилем, объявленным в таблице стилей. Изменение стиля элемента с помощью таблицы стилей не приведет к изменению значения встроенного стиля.

У меня не установлен tampermonkey, поэтому не проверял, измените 

  var hidden_or_display = document.getElementsByClassName("ytp-gradient-bottom")[0].style.display;

на 

  var element = document.getElementsByClassName("ytp-gradient-bottom")[0];
  var hidden_or_display = element.style.display;

  // toggle inline style
  element.style.display = hidden_or_display == "none" ? "block" : "none";
...