如何使用 Javascript 替换图像中的白色？

【问题标题】：How to replace the white in an image using Javascript?如何使用 Javascript 替换图像中的白色？
【发布时间】：2019-05-31 13:15:14
【问题描述】：

Pinterest（这里是 example）和其他一些网站将其图片中的白色替换为灰色。他们对所有图像都这样做，而且似乎是在客户端。

这是否可以使用 Javascript，或者他们有其他方法吗？

【问题讨论】：

您是否尝试过任何类型的研究或实验，看看这是否可行？
@BenBeck 是的，我环顾四周，找不到任何东西。我认为我使用了错误的搜索字词。
他们没有改变图像，他们正在使用 JS 添加覆盖
@ic3b3rg 谢谢。我没有意识到这一点。你知道在任何地方你可以指出我可以解释如何做到这一点吗？

标签： javascript image-processing image-manipulation pinterest

【解决方案1】：

这是一个快速而肮脏的示例，可能会帮助您入门：

$('#container').on("mouseenter mouseleave", () => {
  $('.overlay').toggle(); 
});

#container {
  display: inline-block;
  position: relative;
}

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: .25;
  display: none;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id='container'>
  <img src="http://imagizer.imageshack.com/v2/600x742q90/537/xAgiLR.jpg" width="200px" height="247px">
  <div class="overlay" />
</div>

【讨论】：