波紋が広がるリップルエフェクトボタンの作り方（CSS・Javascript）CSS .ripple { position: relative; overflow: hidden; } .ripple .rp-effect {/*エフェクト*/ position: absolute; border-radius: 50%; opacity: 0.35;/*波紋の濃さ*/ transform: scale(0); background: #FFF;/*波紋色*/ animation: ripple 700ms; pointer-events: none; } @-webkit-keyframes ripple { to { opacity: 0; transform: scale(2.0); } } @keyframes ripple { to { opacity: 0; transform: scale(2.0); } } Javascript (function(
