header-logo
Scopri come creare il sito per la tua attività con Wix.
Progetta il tuo sito con le funzionalità intuitive di Wix.
Gestisci abbonamenti, pacchetti e fatture.
Gestisci la tua attività e comunica con i tuoi membri.
Acquista, trasferisci e collega un dominio al tuo sito.
Fai crescere la tua attività online con gli strumenti giusti.
Aumenta la visibilità del tuo sito con il marketing e la SEO.
Lavora in modo efficace con le funzionalità più avanzate.
Scopri i problemi noti, trova soluzioni o contattaci.
placeholder-preview-image
Diventa un esperto con i nostri corsi e tutorial.
Scopri i consigli per web design, marketing e molto altro.
Scopri come far crescere il traffico organico del tuo sito.
Crea il tuo sito con la nostra piattaforma full stack.
Trova un esperto che ti aiuti a raggiungere i tuoi obiettivi.
placeholder-preview-image

Editor Studio: aggiungere effetti mouse

4 min
In questo articolo
  • Aggiungere un effetto mouse a un elemento
  • Personalizzare un effetto mouse
  • Rimuovere un effetto mouse
Migliora l'interattività del tuo design con i nostri effetti mouse accattivanti. Aggiungi un effetto mouse a un elemento che vuoi mettere in evidenza: il movimento del cursore del visitatore lo attiva automaticamente. 

Offriamo molti effetti diversi che puoi adattare al sito del tuo cliente, come quelli che vedi qui sotto.  
Esempi di diversi effetti mouse che puoi aggiungere a un elemento nell'Editor Studio
Nota:
Poiché questi effetti richiedono un cursore del mouse, non verranno riprodotti sui dispositivi touchscreen (es. cellulari, tablet, ecc.).

Aggiungere un effetto mouse a un elemento

Seleziona l'elemento che vuoi animare e apri il pannello Ispezione per scegliere uno dei nostri effetti mouse. 

Per aggiungere un effetto mouse:

  1. Seleziona l'elemento pertinente
  2. Clicca sull'icona Apri Ispezione  in alto a destra dell'Editor
Screenshot dell'apertura del pannello Ispezione nell'Editor Studio
  1. Clicca sulla scheda Animazioni ed effetti 
  2. Clicca su Effetti mouse, quindi clicca su + Aggiungi
  3. Seleziona un effetto dalla raccolta
  4. (Facoltativo) Clicca su Regola animazione in basso per personalizzare impostazioni come direzione, distanza e interpolazione
Visualizzazione dell'anteprima degli effetti mouse nel pannello Ispezione nell'Editor Studio

Personalizzare un effetto mouse

Dopo aver scelto un effetto mouse, impostalo in modo che si comporti come desideri. Rendi l'effetto più leggero o evidente decidendo impostazioni come la distanza, la direzione, la velocità, l'interpolazione e altro. 
Nota:
Le opzioni di personalizzazione disponibili dipendono dall'effetto che scegli.

Per personalizzare un effetto mouse:

  1. Seleziona l'elemento pertinente
  2. Clicca sull'icona Apri Ispezione  in alto a destra dell'Editor
Screenshot dell'apertura del pannello Ispezione nell'Editor Studio
  1. Clicca sulla scheda Animazioni ed effetti 
  2. Clicca sull'effetto sotto Effetti mouse per modificarlo
  3. Clicca su Regola animazione per modificarne le impostazioni:
    • Direzione: decidi se seguire o seguire il mouse 
      • Segui il mouse: fa sì che l'elemento segua il movimento del cursore del mouse
      • Allontana dal mouse: fa muovere l'elemento nella direzione opposta a quella del mouse. Ad esempio, se il mouse si sposta verso l'alto, l'elemento si sposta verso il basso
    • Distanza: decidi di quanto può spostarsi l'elemento (in px, %, vh o vw)
    • Velocità: trascina il cursore per modificare la velocità dell'effetto: più basso è il numero, più veloce sarà l'effetto 
    • Asse di movimento: decidi se l'elemento si sposta orizzontalmente, verticalmente o su entrambi gli assi
    • Interpolazione: scegli la gradualità con cui l'effetto deve entrare e/o uscire 
    • Prospettiva: scegli la distanza dell'elemento dal cursore del visitatore. Un valore più basso comporterà un effetto 3D più intenso rispetto a un valore più alto
Suggerimento:
Abilita l'interruttore Muovi il mouse per vedere com'è per vedere l'effetto direttamente sull'area di lavoro, senza dover visualizzare l'anteprima del sito.
Configurazione di un effetto mouse nel pannello Ispezione nell'Editor Studio

Rimuovere un effetto mouse

Puoi rimuovere un effetto mouse in qualsiasi momento dal pannello Ispezione. 

Per rimuovere un effetto mouse:

  1. Seleziona l'elemento pertinente
  2. Clicca sull'icona Apri Ispezione  in alto a destra dell'Editor
Screenshot dell'apertura del pannello Ispezione nell'Editor Studio
  1. Clicca sulla scheda Animazioni ed effetti 
  2. Passa il mouse sull'animazione e clicca sull'icona Altre azioni  
  3. Clicca su Rimuovi
Rimozione di un effetto mouse dal pannello Ispezione
Esempi di diversi effetti mouse che puoi aggiungere a un elemento nell'Editor Studio
Screenshot dell'apertura del pannello Ispezione nell'Editor Studio
Visualizzazione dell'anteprima degli effetti mouse nel pannello Ispezione nell'Editor Studio
Screenshot dell'apertura del pannello Ispezione nell'Editor Studio
Configurazione di un effetto mouse nel pannello Ispezione nell'Editor Studio
Screenshot dell'apertura del pannello Ispezione nell'Editor Studio
Rimozione di un effetto mouse dal pannello Ispezione