Éditeur Studio : Ajouter des effets de souris

Temps de lecture : 5 min
Rehaussez l'interactivité de votre design grâce à nos effets de souris captivants. Ajoutez un effet de souris à un élément que vous souhaitez mettre en évidence. Le mouvement du curseur du visiteur le déclenche automatiquement. 

Nous proposons de nombreux effets différents que vous pouvez ajuster au site de votre client, comme ceux que vous voyez ci-dessous.  
Exemples d'effets de souris différents que vous pouvez ajouter à un élément dans l'Éditeur Studio
Dans cet article, découvrez comment faire :
Remarque :
Comme ces effets nécessitent un curseur de souris, ils ne seront pas lus sur les appareils à écran tactile (ex. téléphones mobiles, tablettes, etc.)

Ajouter un effet de souris à un élément

Sélectionnez l'élément que vous souhaitez animer et ouvrez le panneau Inspecteur pour sélectionner l'un de nos effets de souris. 

Pour ajouter un effet de souris :

  1. Sélectionnez l'élément concerné. 
  2. Cliquez sur l'icône Ouvrir l'inspecteur  en haut à droite de l'éditeur.
Une capture d'écran de l'ouverture du panneau inspecteur dans l'Éditeur Studio.
  1. Cliquez sur l'onglet Animations et effets .
  2. Cliquez sur Effets de la souris, puis sur + Ajouter.
  3. Sélectionnez un effet dans la collection.
  4. (Facultatif) Cliquez sur Ajuster l'animation en bas pour personnaliser des paramètres tels que la direction, la distance et le comportement.
Prévisualiser les effets de souris dans le panneau Inspecteur dans l'Éditeur Studio

Personnaliser un effet de souris

Après avoir choisi un effet de souris, configurez-le pour qu'il se comporte comme vous le souhaitez. Rendez l'effet plus subtil ou visible en choisissant des paramètres tels que la distance, la direction, la vitesse, le comportement et autres. 
Remarque :
Les options de personnalisation disponibles dépendent de l'effet que vous choisissez.

Pour personnaliser un effet de souris :

  1. Sélectionnez l'élément concerné.
  2. Cliquez sur l'icône Ouvrir l'inspecteur  en haut à droite de l'éditeur.
Une capture d'écran de l'ouverture du panneau inspecteur dans l'Éditeur Studio.
  1. Cliquez sur l'onglet Animations et effets .
  2. Cliquez sur l'effet sous Effets de souris pour le modifier.
  3. Cliquez sur Ajuster l'animation pour modifier ses paramètres :
    • Direction : Décidez si vous suivez la souris 
      • Suivre la souris : fait suivre à l'élément le mouvement du curseur de la souris.
      • Inverser la souris : fait déplacer l'élément dans la direction contrastée de la souris. Par exemple, si la souris se déplace vers le haut, l'élément se déplace vers le bas. 
    • Distance : Décidez de la distance pour laquelle l'élément peut se déplacer (en px, %, vh ou vw).
    • Velo : Faites glisser le curseur pour modifier la vitesse de l'effet - plus le nombre est bas, plus l'effet est rapide. 
    • Taxe de mouvement : Décidez si l'élément se déplace horizontalement, verticalement ou sur les deux angles.  
    • Comportement : Choisissez la manière dont l'effet doit s'effacer. 
    • Point de vue : Choisissez la distance de l'élément par rapport au curseur du visiteur. Une valeur inférieure entraînera un effet 3D plus intense qu'une valeur supérieure.
Suggestion :
Activez le curseur Déplacer la souris pour prévisualiser pour voir l'effet directement sur la toile, sans avoir à prévisualiser le site. 
Ajuster un effet de souris dans le panneau Inspecteur dans l'Éditeur Studio

Retirer un effet de souris

Vous pouvez retirer un effet de souris à tout moment du panneau Inspecteur. 

Pour retirer un effet de souris :

  1. Sélectionnez l'élément concerné.
  2. Cliquez sur l'icône Ouvrir l'inspecteur  en haut à droite de l'éditeur.
Une capture d'écran de l'ouverture du panneau inspecteur dans l'Éditeur Studio.
  1. Cliquez sur l'onglet Animations et effets .
  2. Survolez l'animation et cliquez sur l'icône Plus d'actions .
  3. Cliquez sur Supprimer.
Retirer un effet de souris du panneau Inspecteur

Cela vous a-t-il aidé ?

|