cari

Rumah >hujung hadapan web >Tutorial H5 >Medium 主页类似 iOS 7 live blur 的高斯模糊效果是如何实现的？

Medium 主页类似 iOS 7 live blur 的高斯模糊效果是如何实现的？

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBasal
2016-06-07 08:44:321732semak imbas

滚动下滑之后，首页顶部图片的高斯模糊的动画效果。

Medium

回复内容：

先用 canvas，然后 fallback 到用两张图片，一张正常，一张模糊。 这里有两个Medium Scroll Effect，建议都可以参考一下：
  1. Medium Scroll Effect
  2. Medium.com style header effect
简单的做法是用CSS filter blur，只是浏览器有兼容问题，所以可以再fallback到svg/canvas/image 应该是用了某个库可以把元素的内容在canvas上绘制，并通过算法加以blur。 苹果官方有demo的 使用coreimage的滤镜或者coregraphics就可以实现
Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：微信5.0打飞机游戏是web app吗？Artikel seterusnya：如果用html5来取代移动端的app，其所面临的问题有哪些？

Artikel berkaitan

Lihat lagi