时间戳

首页 > 解决方案 > 使用 Tampermonkey 更改 HTML 图像的不透明度

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

问题描述

我从来没有在 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>

标签： javascripthtmltampermonkey

解决方案

该 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线路。

推荐阅读