CSS或JavaScript Div模糊效果 [英] CSS or JavaScript Div Blur magic

查看:165
本文介绍了CSS或JavaScript Div模糊效果的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

好的,因此新版本的iCloud网站已经发布。苹果似乎正在疯狂地疯狂伏都教。他们能够模糊登录屏幕后面的背景图标,而我不知道他们是如何做到的。这不是静态图像,因为如果您调整浏览器的大小,图标会更改大小。

Okay, so a new version of the iCloud website is out. It has what appears to be some crazy voodoo Apple magic going on. They were able to blur the background icons behind the login screen, and I can't figure out how they did it. It's not a static image, as the icons change size if you resize the browser.

请问有人请解释一下吗?

Would someone please explain?

https://www.icloud.com/

推荐答案

我认为您可以使用CSS来实现!请签出

I think you can implement using css! please check out

http:// www .w3schools.com / svg / svg_fegaussianblur.asp

您可以使用很多不同的过滤器,例如将它们声明为

You can use alot of different filters by declaring them like

<filter id="f1" x="0" y="0">
      <feGaussianBlur in="SourceGraphic" stdDeviation="15" />
</filter>

这些可以是黑白滤镜,蓝绿色等。从那里可以使用滤镜在对象上进行引用='url(#f1)'

these can be black and white filters, cyanotype etc. From there just reference it on the object using filter='url(#f1)'

编辑

可以使用BLUS CSS完成

CAN BE DONE USING BLUR CSS

http://jsfiddle.net/SvH6w/6/

这篇关于CSS或JavaScript Div模糊效果的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆