H5 WebGL实现水波特效
前言 零几年刚开始玩电脑的时候，经常在安装程序上看到一种水波特效，鼠标划过去的时候，就像用手在水面划过一样，感觉特别有意思。但是后来，就慢慢很少见过这种特效了。最近突然又想起了这种特效，于是开始折磨怎么实现这种效果。 思路 我们知道，水波的运动轨迹可以看成随时间变化的三角函数，那么我们可以记录每个水波形成的原点和运行时间，就能知道任一时刻水波的高度。但是，这种方法的运算量会随着水波数量而线性增长
Html/CSS 2023年09月09日 58
TAGS:水波
使用feDisplacementMap+feImage滤镜实现水波纹效果(计算动态值)
该文章已经讲的特别细致了，该篇仅以此记录动效过程中各点的计算。 1.feDisplacementMap feDisplacementMap 实际上是一个位置替换滤镜，就是改变元素和图形的像素位置的。遍历原图形的所有像素点，使用feDisplacementMap重新映射替换一个新的位置，形成一个新的图形。feDisplacementMap滤镜在业界的主流应用是对图形进行形变，扭曲，液化
Html/CSS 2023年08月17日 76
