相关疑难解决方法(0)

我正在寻找一个" 吸管 "工具,它给出了鼠标光标所在像素的十六进制值,用于CMS的JavaScript.

对于Firefox,有一个非常出色的ColorZilla扩展.但是,它当然只是FF,我真的很想将这个工具与CMS一起提供.

荷兰开发人员有一个非常聪明的想法,即使用Ajax和PHP的组合imagecolorat()来查找图像上的Pixel颜色.但这限制了我可以访问服务器端的图像的范围,我真的梦想着一个通用的工具.

我将使用其中一种方法,但更喜欢基于跨浏览器,基于Javascript或Flash的方式,不需要服务器端摆弄和不安装扩展.

我也对任何可以做ColorZilla可以做的IE特定解决方案感兴趣 - 我只能支持IE和FF,虽然跨浏览器解决方案当然是理想的.

这是一个惊喜.以下代码似乎没有给我屏幕上的实际颜色:

h1 = document.querySelector("h1");
window.getComputedStyle(h1).color

给rgb(0, 0, 0)我认为是正确的.然而

window.getComputedStyle(h1).backgroundColor

给rgba(0, 0, 0, 0).我在屏幕上看到的实际背景颜色是白色.

我调用h1的元素在屏幕上可见.我期待得到实际的背景颜色.我得到的值(在rgba中)没有错,但也不是很有用.它只是告诉我背景是完全透明的 - 这不是一种颜色.

如何获得RGB的实际背景颜色？

我有这个 HTML 页面：

document.addEventListener("DOMContentLoaded", function (event) {
  var inner_div = document.getElementById("innerDiv");
  console.log(getComputedStyle(inner_div, null)["backgroundColor"]);
});

#outterDiv {
  background-color: papayawhip;
}

<div id="outterDiv">
  <div id="innerDiv">
    I am an inner div
  </div>
</div>

我想找出内部 div 的计算背景颜色，而不必查看父元素的计算样式。那可能吗？