emoji claps

Emoji-Claps

Un élément accro à l'expérience pour applaudir ? / j'aime ? / je n'aime pas ? .

Quoi de neuf?

Oui, vous pouvez click et hold pour augmenter le nombre. Essayez-le sur Codepen !

Installation

$ yarn add emoji-claps // ES module

ou dans le navigateur

 < script src =" https://unpkg.com/emoji-claps/dist/emoji-claps.umd.js " > </ script >
<!-- It's umd bundle--> 

Polyremplissage

L'animation utilise la méthode Element.animate et effect.target , c'est sophistiqué et impératif mais ne prend pas entièrement en charge la version basse du navigateur et Safari, veuillez donc exécuter l' web-animation next le polyfill avant l'initiale.

 < script src =" https://rawgit.com/web-animations/web-animations-js/master/web-animations-next-lite.min.js " > </ script > 

Usage

 < emoji-claps 
             emoji =" ? " 
             currentcount =" 30 " 
             maxcount =" 50 " 
             bullets =' ["?","?","","?"] ' 
             bulletcount =" 6 " 
             prefix =" + "
             > </ emoji-claps > 

Événement

complet

L'événement full se déclenchera lorsque currentcount === maxcount .

Prenons un exemple

 const emojiClaps = document . querySelector ( 'emoji-claps' ) ;
emojiClaps . addEventListener ( 'full' , e => {
  // Do something if currentcount is 50 (maxcount)
} )

cliquez

L'événement click se déclenchera lorsque l'utilisateur cliquera sur emoji-claps .

Prenons un exemple

 const emojiClaps = document . querySelector ( 'emoji-claps' ) ;
emojiClaps . addEventListener ( 'click' , e => {
  // Do something track after user click
} )

---

LICENCE MIT © 2019 realdennis