我试图模糊一个固定的位置标题后面的内容,使其背后的内容有用户滚动在这个div后面模糊.
我过去在CSS中用简单的不透明度来实现这一点,但这并不会使DIV背后的内容变蓝,只是在它前面加上一个半透明的面板.
是否有一个简单的方法,即使它是一个实现我后来的作弊.是否使用PNG背景图片或CSS.
看看iOS7做这个http://www.apple.com/ios/ios7/features/的方式.
解决方法
现在是2015年,苹果宣布了Safari 9,它支持一个新的CSS功能,背景滤镜.在您的div上使用此CSS规则将过滤器应用于其后面的元素：
#myDiv {
backdrop-filter: blur(10px);
}
此功能目前仅在Safari中可用(并且-webkit前缀是必需的),所以我现在不建议使用它.如果这样做,请确保使用@supports或/和JS来对不支持它的浏览器执行回退：
@supports (backdrop-filter: blur(10px)) {
#myDiv { background: #181818; }
}
这是compatibility table at caniuse.com,以及Chromium和Firefox的功能要求.
了解更多关于what’s new in Safari.
