Zero Block: Animation de la gâchette

Comment configurer l'animation d'un élément qui est déclenché par un clic ou un survol d'un autre élément ?
Pour commencer
Les déclencheurs font partie d'une animation pas à pas. Pour travailler avec l'animation par déclenchement, vous devez apprendre les bases de l'animation pas à pas dans ce guide :
Pour créer une animation de déclenchement, il faut commencer par mettre en place une animation pas à pas. Pour ce faire, ouvrez les paramètres de l'élément et cliquez sur Ajouter dans la section "Animation pas à pas".
Zero Block: The "ADD" button under "STEP BY STEP ANIMATION" in the element settings panel on the right.
Sélectionnez le type d'événement qui doit déclencher l'animation. Le déclenchement de l'animation ne peut se faire qu'au survol ou au clic.
In Zero Block, the "on Click" option in the "EVENT" drop-down list within the "STEP BY STEP ANIMATION" panel on the right.
Cliquez sur Add trigger et sélectionnez un élément dans Zero Block qui doit déclencher l'animation. L'animation démarrera après un clic ou un survol de cet élément.
Zero Block editor: the "STEP BY STEP ANIMATION" panel with "EVENT" set to "on Click" and a selected button element assigned under "TRIGGER".
Après avoir sélectionné un déclencheur, ajoutez des étapes d'animation. Par exemple, nous avons ajouté le déplacement de la forme de 300px vers la droite lors d'un clic sur le bouton.
Zero Block: Step-by-step animation settings panel on the right, showing an assigned trigger element, animation steps, and step properties.
CLIQUEZ ICI !
Comment tester une animation de déclenchement dans votre navigateur
En plus des boutons "Play Element" et "Play All", Tilda vous permet de prévisualiser votre animation dans le navigateur.

Ouvrez deux onglets dans votre navigateur -Zero Block et la même page en mode prévisualisation.

De cette façon, vous pouvez observer les changements que vous effectuez dans Zero Block en les prévisualisant dans le second onglet. Pour que les modifications apparaissent sur la page, actualisez la page de prévisualisation.
Fabriqué le
Tilda