文章关键字 ‘filter’
2013年11月21日,星期四
前段时间,iOS7不是瓜未熟就落地了嘛,然后捡瓜的人很多,然后国内外开始了各种探讨,从界面到动画,从兼容到实现等。其中,“毛玻璃”一次梆梆出世,一些爱折腾的弄潮人就可以琢磨怎么用CSS实现之,国内有之,国外也有之……
虽然本文标题也有“毛玻璃”二字,sorry,是“三字”。但是,并不是介绍如何实现毛玻璃效果的,而是介绍毛玻璃效果实现的基础——模糊。哈哈,恕我取巧,借用“毛玻璃”之词,沾沾喜气,散发芳气;蜂飞蝶舞,围观博主。
本文很单纯,就是图片模糊效果的实现。demo、源代码、截图、拓展以及御用模特应有尽有,希望本文的内容能够对您的学习有所帮助!
阅读全文…
标签:blur, canvas, filter, getImageData, SVG, 图片, 模糊, 滤镜, 高斯模糊
发布在 CSS相关, SVG相关 | 28 条评论 »
2013年04月25日,星期四
ES5中新增的不少东西,了解之对我们写JavaScript会有不少帮助,比如数组这块,我们可能就不需要去有板有眼地for
循环了。
ES5中新增了写数组方法,如下:forEach
, map
, filte
r, some
, every
, indexOf
, lastIndexOf
, reduce
, reduceRight
……
阅读全文…
标签:ES5, every, filter, forEach, indexOf, lastIndexOf, map, reduce, reduceRight, some, 数组
发布在 JS实例 | 46 条评论 »
2012年08月22日,星期三
去年9月份曾写过“使用SVG实现gradient背景渐变”一文,其中有对SVG比较术语化的解释,以及SVG的创建、SVG编辑器使用、简单的实际应用等。
不过,之前的介绍,虽然也有内容,不过总给人以生硬之感,仿佛是直接从山上凿下的原石,没有美化与雕琢。而这里的介绍(自然没有重复)似乎更接地气些,应该会给你一点别样的关于SVG的收获。
一如既往,有demo,有截图,有源代码示意。希望本文的内容能够对您的学习有所帮助。
阅读全文…
标签:3d, background, css3, filter, Firefox, SVG, transform
发布在 SVG相关 | 30 条评论 »
2012年08月19日,星期日
可能早就知道,像汶川这种糟糕的日子网站全灰在IE下是可以轻松实现的(filter: gray;
),不过,当时,其他浏览器是无解的。不过,时代发展,如今,CSS3的逐步推进,我们也开始看到“黑白效果”大规模应用于实际的可能。
本文就将介绍如何是有CSS3的一些新方法实现图片的黑白效果。另外,最后还介绍下一款可以实现各个浏览器下图片黑白的小JS插件。有截图,有demo,有代码示意,希望本文的内容能够对您的学习有所帮助。
阅读全文…
标签:filter, grayscale, SVG, 图片黑白, 滤镜
发布在 CSS相关, SVG相关 | 40 条评论 »
2011年05月23日,星期一
IE6-IE8浏览器不支持CSS3多背景(Multiple backgrounds),只使得这个很惹人爱的属性没了用武之地,好在IE浏览器下还是有替代的解决方法的。而本文的内容就是介绍这种替代方法,并展示了比较实际的应用实例。显然,像这种性质文章,demo页面自然少不了,丰富飞截图自然少不了,必要的源代码展示也少不了。总之,希望本文的内容能够对您的学习有所帮助。
阅读全文…
标签:background, css3, filter, IE6, IE7, IE8, IE滤镜, Multiple backgrounds, png32, 多背景, 宽度自适应, 按钮
发布在 CSS相关 | 12 条评论 »
2010年07月27日,星期二
我之前曾写过一篇关于实现跨浏览器实现box-shadow效果的文章——“CSS实现跨浏览器兼容性的盒阴影效果”,本文虽然题目类似,但是核心部分是有差异的。前面的文章虽然实现IE下的盒阴影效果也是使用的滤镜,但是使用的是shadow滤镜,这种滤镜的效果很牵强,效果过渡不自然,而本文实现的IE下的盒阴影效果就相对非常自然,而且还支持内阴影的UI表现。
本文提供各个效果截图,提供丰富飞实例以及代码展示,希望能对您的学习有所帮助。
阅读全文…
标签:box-shadow, chrome, css3, filter, Firefox, hack, IE, z-index, 兼容性, 滤镜, 绝对定位
发布在 CSS相关 | 12 条评论 »
2010年04月9日,星期五
经过之前对Firefox浏览器渐变背景实现的详细介绍,以及webkit核心浏览器下渐变背景实现的详细介绍,这里可以很游刃有余的介绍如何实现兼容性的渐变背景效果了。本文由一部分内容是介绍如何使用滤镜实现IE下的渐变背景效果,配合CSS3的gradient渐变属性,实现兼容性的渐变背景效果(Opera浏览器除外)。本文提供详细的代码展示,效果截图以及demo页面,希望能对您的学习有所帮助。
阅读全文…
标签:background, chrome, css-gradient, css3, filter, Firefox, IE, rgba, Safari, 兼容性, 渐变
发布在 CSS相关 | 23 条评论 »