使用Tampermonkey更改HTML图像的不透明度

时间:2018-11-02 22:06:17

标签: javascript html tampermonkey

我从来没有在Tampermonkey中创建任何东西,因此我非常感谢您的帮助。

一个简单的脚本如何将以下元素的不透明度更改为1? :

<div style="position: absolute; top: 1171px; left: 452px; -ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=10)'; filter: alpha(opacity=10); -moz-opacity: 0.1; opacity: 0.1; -khtml-opacity: 0.1; opacity: 0.1; z-index: 19;">
  <a href="https://eggcave.com/gobblers/find?code=l9PCaWSN4Qm2cwoHZMtU7fhLXx8x8j8RPlsu4YpfjSgFHXMvWWqN9mImdY2s5S1lNNaVaB1QD5cHeN3hKQazN4V2XKnje1ffDiLk20BLahA8YuprAjTilLtKDHzLJZAU">
    <img src="https://static.eggcave.com/90by90/gobbler_3.png">
  </a>
</div>

1 个答案:

答案 0 :(得分:0)

仅凭HTML不足以使图像真正吸引人,您也没有指出页面是否由javascript(AJAX)驱动。 您可能需要链接到目标页面。(或提供MCVE。)

尽管如此,在大多数情况下,以下完整的工作脚本就足够了:

// ==UserScript==
// @name     _Be through with see-through pictures
// @match    *://YOUR_SERVER.COM/YOUR_PATH/*
// @require  https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @require  https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant    GM_addStyle
// ==/UserScript==
//- The @grant directives are needed to restore the proper sandbox.

waitForKeyElements ("div[style*=opacity] > a > img[src*='gobbler_']", deOpaqueifyParent);

function deOpaqueifyParent (jNode) {
    var parentNd = jNode.closest ("div");
    parentNd.css ( {
        filter: "",
        "-ms-filter": "",
        "-moz-opacity": "",
        "-khtml-opacity": "",
        opacity: "1",
    } );
}

只需根据需要更改@match行。