diff options
Diffstat (limited to 'src/client/directives/click-anime.ts')
| -rw-r--r-- | src/client/directives/click-anime.ts | 22 |
1 files changed, 22 insertions, 0 deletions
diff --git a/src/client/directives/click-anime.ts b/src/client/directives/click-anime.ts new file mode 100644 index 0000000000..864155f076 --- /dev/null +++ b/src/client/directives/click-anime.ts @@ -0,0 +1,22 @@ +import { Directive } from 'vue'; + +export default { + mounted(el, binding, vn) { + el.addEventListener('mousedown', () => { + el.classList.add('_anime_bounce_ready'); + + el.addEventListener('mouseleave', () => { + el.classList.remove('_anime_bounce_ready'); + }); + }); + + el.addEventListener('click', () => { + el.classList.add('_anime_bounce'); + }); + + el.addEventListener('animationend', () => { + el.classList.remove('_anime_bounce_ready'); + el.classList.remove('_anime_bounce'); + }); + } +} as Directive; |