jquery - 元素的 CSS，在页面加载结束时还原？

Question

我正在尝试更改

的 position

<div class="BannerRedesign" id="Banner" style="position: fixed ! important; height: 36px ! important; width: 100% ! important;">
    <div class="BannerCenterContainer" id="NavigationRedesignBannerContainer">

(roblox 横幅元素，试图让它不 float )到 relative 使用 Greasemonkey，启用所有权限。但是，每次在文档加载结束时，它都会恢复为 float 状态。

我什至尝试将 bannercentercontainer 附加到不同的元素，但我不知道我是否做对了......你能帮我把这个改成相对位置吗？

我试过:

$('#Banner').css('position', 'relative !important')

和

if ($('#Banner').css('position') == 'fixed') {
$('#Banner').css('position', 'relative')
}

，但它只是在页面加载完成后变回原样。

Answer 1

该横幅可能设置在静态 HTML 中并由 AJAX 定期重置。

修复它的一种方法是使用 the waitForKeyElements() utility .

这是一个完整的脚本，它可以处理问题中给出的代码:

// ==UserScript==
// @name     _Unfix annoying banner
// @include  http://YOUR_SERVER.COM/YOUR_PATH/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
// @require  https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant    GM_addStyle
// ==/UserScript==
/*- The @grant directive is needed to work around a design change
    introduced in GM 1.0.   It restores the sandbox.
*/

waitForKeyElements ("#Banner", unFixThePositioning);

function unFixThePositioning (jNode) {
    jNode.css ('position', 'relative');

    //-- Or, for a little extra "Oomph":
    jNode[0].style.setProperty ("position", "relative", "important");

    return true;    //-- Check repeatedly.
}