Nota: Sebbene le nostre guide più popolari siano state tradotte in italiano, alcune guide sono disponibili solo in inglese.

Creare degli effetti al passaggio del mouse per le immagini

Gli effetti al passaggio del mouse mostrano informazioni o creano movimento quando sposti il cursore su un'immagine. Questo ti permette di aggiungere al tuo sito un livello di interazione e animazione non invasivo, ideale per mostrare titoli e didascalie senza oscurare un'immagine né occupare spazio aggiuntivo su una pagina.

Puoi usare effetti al passaggio del mouse su qualsiasi sito con Blocchi immagine e Blocchi Galleria Slideshow. A seconda della versione e del modello del sito, il sito potrebbe supportare anche gli effetti al passaggio del mouse in altre aree del sito. Questa guida illustra ogni area in dettaglio.

Suggerimento: la maggior parte dei dispositivi mobili non supporta gli effetti al passaggio del mouse, pertanto l'esperienza dei visitatori può variare a seconda del dispositivo utilizzato per visitare il sito.

Blocchi immagine

Puoi visualizzare una didascalia dell'immagine al passaggio del mouse in Blocchi immagine in linea.

  1. Aggiungi un nuovo Blocco immagini o aprine uno esistente.
  2. Nella scheda Progettazione, seleziona In linea.
  3. Seleziona Didascalia sovrapposta al passaggio del mouse dal menu a discesa.
  4. Clicca su Applica per chiudere la finestra.
  5. Passa il mouse sul Blocco immagini. Nella didascalia sovrapposta nera che apparirà, clicca su Scrivi qui... e digita la tua didascalia.
  6. Dopo aver salvato la pagina, la didascalia si visualizza al passaggio del mouse. Usa i ritocchi di stile per conferire stile alla didascalia dell'immagine.

Blocchi galleria a slideshow

Puoi visualizzare i titoli e le descrizioni delle immagini al passaggio del mouse in un Blocco galleria a slideshow.

  • Gli effetti al passaggio del mouse sono disponibili nel design Blocco galleria a slideshow.
  • Titoli e descrizioni non potranno essere visualizzati su dispositivi mobili più stretti di 480 pixel.
  • Le didascalie impostate per comparire al passaggio del mouse possono essere visualizzate sui dispositivi più grandi, ad esempio i tablet, o su quelli più piccoli in modalità orizzontale. Le didascalie saranno sempre visibili oppure appariranno al tocco o al tocco prolungato, a seconda del dispositivo mobile.

Per aggiungere testo e abilitare gli effetti al passaggio del mouse:

  1. Aggiungi un nuovo Blocco galleria a slideshow o aprine uno esistente.
  2. Nella scheda Contenuto, passa il mouse su un'immagine e clicca su l'icona dell'ingranaggio.
  3. Immetti un titolo e una descrizione. È inoltre possibile aggiungere un URL di click-throughopzionale. 
  4. Clicca su Salva.
  5. Clicca sulla scheda Design .
  6. Spunta Mostra titolo e descrizione.
  7. Seleziona una posizione dal menu a discesa Posizione del titolo e della descrizione.
  8. Clicca suMostra al passaggio del mouse.
  9. Clicca su Applica.

Pagine Portfolio

Alcuni layout di pagina del portfolio supportano gli effetti al passaggio del mouse. Nell'editor della pagina del portfolio, scegli uno dei seguenti layout:

  • Passaggio del mouse: sfondo - Mostra i titoli delle pagine secondarie secondo un layout impilato o in linea. Passando il mouse sopra a un titolo, l'immagine in miniatura della pagina secondaria sostituisce lo sfondo della sezione.
  • Al passaggio del mouse: fisso - Visualizza i titoli delle pagine secondarie secondo un layout impilato o in linea. Quando passi il mouse sopra a un titolo, l'immagine in miniatura della pagina secondaria viene visualizzata più piccola, in una posizione fissa della sezione.
  • Al passaggio del mouse: segui cursore - Visualizza i titoli delle pagine secondarie secondo un layout impilato o in linea. Quando passi il mouse sopra a un titolo, l'immagine in miniatura della pagina secondaria viene visualizzata più piccola e segue il movimento del cursore. 

Per maggiori informazioni, visita Pagine portfolio

Pagine negozio

Gli effetti al passaggio del mouse funzionano in modo diverso a seconda della versionedel sito. 

Quando un prodotto ha più di un'immagine, la pagina del negozio visualizza un'immagine di prodotto alternativa al passaggio del mouse. Ulteriori informazioni nelle pagine dei prodotti per la definizione dello stile

Il modo in cui gli effetti al passaggio del mouse vengono visualizzati dipende dal tipo di Pagina prodotti relativo alla famiglia del tuo modello:

Pagine galleria (versione 7.0)

Alcuni modelli supportano gli effetti al passaggio del mouse per le Pagine galleria. Puoi attivare e regolare questi effetti usando Stili sito.

Titoli e descrizioni delle immagini vengono visualizzati al passaggio del mouse per i design Slideshow e A griglia nelle seguenti famiglie di modelli:

  • Adirondack
  • Aviator
  • Bedford
  • Brine
  • Farro
  • Five
  • Galapagos
  • Native
  • Pacific
  • Skye
  • York

Abilitare e personalizzare l'effetto al passaggio del mouse

Nella Pagina galleria, apri Stili sito e scorri verso il basso fino a Stili galleria. Clicca su Design galleria e seleziona Slideshow o Griglia

  • Slideshow - Seleziona Mostra al passaggio del mouse dal menu a discesa Sovrapposizione informazioni galleria. Titoli e descrizioni saranno visualizzati al passaggio del mouse. Le didascalie impostate per apparire al passaggio del mouse possono essere visualizzate sui dispositivi mobili più grandi, ad esempio i tablet, o su quelli più piccoli in modalità orizzontale. Le didascalie saranno sempre visibili oppure appariranno al tocco o al tocco prolungato, a seconda del dispositivo mobile.
  • Griglia: titoli e descrizioni si visualizzano al passaggio del mouse quando l'immagine viene aperta in una lightbox, a meno che l'immagine non abbia un URL di click-through. Per ulteriori informazioni, visita Impostazione delle immagini da aprire in una lightbox.

Altri effetti della Pagina galleria per modello

Le Pagine galleria presentano effetti speciali al passaggio del mouse nelle seguenti famiglie di modelli:

  • Forte - Passare il mouse sul carosello della Pagina galleria ne visualizzerà le frecce di navigazione. Passando il mouse su una didascalia, questa scorre verso l'alto in modo da poter leggere le descrizioni più lunghe.
  • Momentum - Freccia di navigazione al passaggio del mouse in modalità schermo intero.
  • Tremont - Mostra le didascalie al passaggio del mouse.
  • Wexley - Passare il mouse sulle immagini in una Pagina galleria ne visualizza il titolo e un colore di sovrapposizione.

Pagine Indice (versione 7.0)

Le Pagine indice presentano effetti speciali al passaggio del mouse nelle seguenti famiglie di modelli:

  • Avenue - Passare il mouse su una miniatura ne modifica l'opacità. Puoi anche mostrare il titolo di navigazione della pagina al passaggio del mouse.
  • Flatiron - Passare con il mouse su una miniatura ingrandisce e fa una panoramica dell'immagine.
  • Montauk - Passare il mouse su una miniatura ne modifica l'opacità.
  • Tremont - Passare il mouse su un titolo della pagina nella navigazione dell'Indice fa sì che la miniatura della pagina venga visualizzata come un immagine di sfondo.
  • York - Le immagini in miniatura possono dissolversi al passaggio del mouse e i titoli delle miniature possono essere visualizzati al passaggio del mouse.

Visita le guide ai modelli per maggiori informazioni.

Questo articolo ti è stato utile?
Utenti che ritengono sia utile: 43 su 225
Creare degli effetti al passaggio del mouse per le immagini