根据网站背景颜色更改背景颜色答案

【问题标题】：Change background color based on website background color根据网站背景颜色更改背景颜色
【发布时间】：2015-05-25 09:26:50
【问题描述】：

我正在尝试实现与以下示例类似的效果，其中网站的徽标和菜单图标根据每个元素背后的背景改变颜色。

http://www.borngroup.com/work/dkny/

看起来是通过 javascript 对每个元素的背景颜色进行了更改，但我不知道这是如何实现的。

任何帮助将不胜感激！

【问题讨论】：

您是否尝试过查看网站的 JavaScript？如果它没有被混淆，你可能能够找出他们是如何做到的，尽管在我看来他们只是计算了页面上某些元素的 y 位置，并在 onScroll()期间检查了滚动位置是否超过了它>
This answer 可能会有所帮助。

标签： javascript html css

【解决方案1】：

我不知道这是否是 Borngroup 正在做的事情，但您可以只使用带有背景图像和 background-attachment:fixed 的 css 来完成这种效果。

Here's a quick demonstration.

body {
    height: 1000px;
}   

#one {
    background-color:black;
    background-image: url('http://d.pr/i/18pT3+');
    background-attachment: fixed;
    background-repeat: no-repeat;
    height:100px;
}

#two {
    background-color:yellow;
    background-image: url('http://d.pr/i/1capU+');
    background-attachment: fixed;
    background-repeat: no-repeat;   
    height:100px;
}

【讨论】：