问题描述
我目前正在使用我在github上找到的脚本来“解除工具栏的锁定”(只是阻止CSS元素随页面滚动;不知道我是否使用了正确的术语)。它适用于chrome上的tampermonkey(尽管脚本页面上有错误),但不适用于Firefox中的greasmonkey。为什么在firefox中它不能与滑脂猴子一起使用,我该如何解决?
// ==UserScript==
// @name unfix-all-the-toolbars
// @description Removes "position: fixed" style from elements,unfixing "toolbars" and the such.
// @namespace https://hasanyavuz.ozderya.net
// @include *
// @version 1
// @grant none
// ==/UserScript==
// Based on https://stackoverflow.com/questions/13696100/greasemonkey-script-to-make-fixed-positioned-elements-static
// and https://gist.github.com/vbuaraujo/bddb3b93a0b2b7e28e1b
fixed_items = [];
function unfixAll() {
Array.forEach(
document.querySelectorAll("h1,h2,ul,ol,li,div,nav,header,footer"),function (el) {
var style = window.getComputedStyle(el);
if (style.position === "fixed" && style.top == "0px" &&
!(style.display === "none" || style.visibility === "hidden"))
/* Avoid unfixing JavaScript popups like Twitter's "confirm retweet" window */
{
fixed_items.push(el);
//el.style.position = "static";
el.style.visibility = "hidden";
/* I tried using "absolute" in the past,but this breaks wordpress's footer.
Using "static" breaks it too,but at least it doesn't get in the way. */
}
});
}
function fixBack()
{
Array.forEach(
fixed_items,function(el) {
//el.style.position = "fixed";
el.style.visibility = "";
}
)
fixed_items = [];
}
function onScroll()
{
if (window.scrollY > 0)
{
unfixAll();
}
else
{
fixBack();
}
}
window.addEventListener("scroll",onScroll);
解决方法
它与chrome上的tampermonkey一起使用(尽管脚本页面上有错误),但与Firefox中的greasmonkey一起使用。
当我回答另一个脚本的查询时遇到类似的问题(参考:[FireMonkey] Request YT' JS script ad blocker。
脚本未声明变量,例如fixed_items = [];
并以严格模式破坏脚本。
以下是相同的代码 :(我尚未测试过)
// ==UserScript==
// @name unfix-all-the-toolbars
// @description Removes "position: fixed" style from elements,unfixing "toolbars" and the such.
// @namespace https://hasanyavuz.ozderya.net
// @include *
// @version 1
// @grant none
// ==/UserScript==
// Based on https://stackoverflow.com/questions/13696100/greasemonkey-script-to-make-fixed-positioned-elements-static
// and https://gist.github.com/vbuaraujo/bddb3b93a0b2b7e28e1b
(() => { // anonymous function wrapper,for error checking & limiting scope
let fixed_els = [];
function unfixAll() {
document.querySelectorAll('h1,h2,ul,ol,li,div,nav,header,footer').forEach(el => {
const style = window.getComputedStyle(el);
if (style.position === 'fixed' && style.top == '0px' &&
!(style.display === 'none' || style.visibility === 'hidden')) {
// Avoid unfixing JavaScript popups like Twitter's "confirm retweet" window
fixed_els.push(el);
el.style.visibility = 'hidden';
/* I tried using "absolute" in the past,but this breaks WordPress's footer.
Using "static" breaks it too,but at least it doesn't get in the way. */
}
});
}
function fixBack() {
fixed_els.forEach(el => el.style.visibility = '');
fixed_els = [];
}
function onScroll() {
window.scrollY > 0 ? unfixAll() : fixBack();
}
window.addEventListener('scroll',onScroll);
})();