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

I'm trying to achieve a similar effect to the example below where the website's logo and menu icon change color depending on the background behind each element.

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

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

It looks like the change is made via javascript to each element's background color but I cant figure out how this is achieved.

看起来通过javascript对每个元素的背景颜色进行了更改,但我无法弄清楚如何实现这一点。

Any help would be much appreciated!

任何帮助将非常感激!

1 个解决方案

#1

I don't know if this is what borngroup is doing, but you can accomplish this sort of effect using just css with background images and background-attachment: fixed.

我不知道这是否是borngroup正在做的事情,但你可以使用css与背景图像和background-attachment:fixed来实现这种效果。

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;
}

#1