javascript - 如何创建流畅的动画流动按钮?

标签 javascript html css button

我打算将我网站中的所有 input[type=submit]button 更改为这个流畅的动画流动按钮。

那么,我该如何使用 HTML、JavaScript 和 CSS 创建它呢?特别是我制作了这张 GIF 以将其发布在 Stack Overflow 中。而且我不认为,我必须在这个问题中发布一些代码来解释它。 :/

Smooth

编辑:我不想要从右下角到左上角的 curl 效果。它应该从我点击的区域开始影响。在下一个 GIF 中,我点击了中间部分。现在请看效果。

Flowing

希望你能明白我的意思。 它应该从我点击的确切区域开始流到外面。

最佳答案

您可以在其中使用 hover.css、Checkout 背景转换 http://ianlunn.github.io/Hover/ . 如果您想要与您发布的完全一样。你总是可以尝试使用 hover.css 进行一些试验和错误

关于javascript - 如何创建流畅的动画流动按钮?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46578734/

相关文章:

javascript - 所有带有类的按钮的 CSS 选择器

HTML CSS : Show Black text with Opacity Layer

html - 当 Flexbox 元素以列模式换行时,容器不会增加其宽度

javascript - Angular 5 - 正确管理服务器请求

javascript - 循环数组属性和中断

javascript - 将 ref 传递给 hook 问题

html - 如何让背景图像知道它在 CSS 中的高度?

javascript - 如何使用 Selenium 检查 javascript 应用程序中的内存泄漏?

PHP。联系表格错误更改文本区域的颜色而不重定向

css - 如何在导航栏中放置背景