ボタンプラグイン
waveButton
クリックで画面全体を波形SVGが覆うトランジションボタン。
デモ
概要
クリックすると波形 SVG が画面を覆い、href へ遷移します。href が "#" の場合は遷移せずアニメーションのみ再生します。
パラメーター
| パラメーター | デフォルト | 説明 |
|---|---|---|
text |
— | ボタンラベル(必須) |
href |
"#" |
遷移先 URL |
color |
"var(--color-primary)" |
ウェーブの色 |
textColor |
"var(--color-primary)" |
ボタンテキスト・枠線の色 |
使用例
{% from "block-button-wave/block-button-wave.njk" import waveButton %}
{{ waveButton("次のページへ", "/about/") }}
{{ waveButton("デモ再生", "#", color="var(--color-primary)") }}