déclencher des choses selon un événement ######################################## quelques événements =================== * ``click`` : au clic * ``mousemove`` : la souris bouge sur l'élément * ``mouseenter`` : la souris entre au survol sur l'élément * ``mouseout`` : la souris sort du survol de l'élément * ``mousedown`` : le clic de la souris est enclenché * ``mouseup`` : le clic de la souris est relâché quelques éléments sur lequels déclencher un événement ===================================================== * ``document.body`` : l'élément ```` de la page web * ⚠️ ``document.querySelector('g')`` : le premier élément de la page (votre animation dans ce contexte) ⚠️ voir avertissement ci-dessous * ``document.querySelector('#exemple')`` : élément avec l'id "exemple" .. warning:: Si vous essayez de sélectionner un élément avant son ajout au DOM (à la page), il ne pourra pas l'être. Aussi, si vous sélectionner votre animation avant son ajout, cela va poser problème, il faudra procéder comme suit. .. code-block:: javascript votre_animation.addEventListener( "DOMLoaded", main ); function main () { var groupe = document.querySelector('g'); // reste du code à exécuter } exemples d'application ====================== Dans le fichier master.js par exemple .. code-block:: javascript // lors du clic sur la page, on exécute la fonction ci-dessous document.body.addEventListener( 'click', fonction_a ) function fonction_a () { // } .. code-block:: javascript votre_animation.addEventListener( "DOMLoaded", main ); function main () { var groupe = document.querySelector('g'); groupe.addEventListener( 'mouseenter', fonction_a ) groupe.addEventListener( 'mouseenter', fonction_b ) } function fonction_a () { // } function fonction_b () { // }