如何在点击时创建涟漪效果-材料设计

11 浏览
0 Comments

如何在点击时创建涟漪效果-材料设计

我对CSS动画还不太熟悉，过去几个小时一直试图通过查看代码让它们的动画效果起作用，但我目前还无法实现。

我指的是这个效果：https://angular.io/ （菜单效果）。

基本上，它是一个在单击时从鼠标光标处扩散一个圆圈的动画。

似乎归结为这两行代码：

transition: box-shadow .4s cubic-bezier(.25,.8,.25,1),background-color .4s cubic-bezier(.25,.8,.25,1),-webkit-transform .4s cubic-bezier(.25,.8,.25,1);
transition: box-shadow .4s cubic-bezier(.25,.8,.25,1),background-color .4s cubic-bezier(.25,.8,.25,1),transform .4s cubic-bezier(.25,.8,.25,1);

附注：也许有一些我没有注意到的jQuery。

0