Rivedere le impostazioni di parallax scrolling e suggerimenti per la risoluzione dei problemi.

I modelli della famiglia Brine utilizzano uno speciale effetto visivo sulle immagini di intestazione chiamato scorrimento con parallasse. Lo scorrimento con parallasse prevede un'immagine di sfondo che si muove più lentamente del contenuto in primo piano, creando un'illusione di profondità e immersione.

Per produrre un effetto di parallax scrolling simile nella versione 7.1, utilizza gli effetti dell'immagine di sfondo.

Ecco un esempio di scorrimento con parallasse nel modello Burke:

Prima di iniziare

• Per sapere se il modello supporta lo scorrimento con parallasse, consulta l'elenco dei modelli della famiglia Brine.
• Quando viene abilitato lo scorrimento con parallasse, tutti i banner del sito ne saranno coinvolti.
• Parallax scrolling funziona sui dispositivi mobili.
• La famiglia Marquee, fuori produzione, supporta anche lo scorrimento con parallasse. Per ulteriori informazioni, visita la guida al modello Marquee.
• Per saperne di più sul parallax scrolling e sull'accessibilità, visita Rendere più accessibili audio, immagini e video. 

Pagine supportate

Lo scorrimento con parallasse è disponibile sulle pagine che supportano i banner:

• Pagine indice (immagini di sfondo dietro le sezioni della pagina di layout)
• Pagine di layout
• Pagine negozio
• Pagine eventi
• Pagine Album
• Pagine del blog
• Pagine galleria

Abilitare o disabilitare lo scorrimento con parallasse

Se i banner del tuo sito non mostrano l'effetto con parallasse, attivalo negli Stili del sito della famiglia Brine:

1. Apri il pannello Stili sito.
2. Scorri verso il basso fino alla sezione Principale: sovrapposizione.
3. Seleziona Abilita parallasse.
4. Potresti anche voler selezionare Ritaglio intelligente Parallax per ridurre al minimo il ritaglio.
5. Clicca su Salva. 

Per disabilitare il parallax scrolling per il sito, segui gli stessi passaggi, ma deselezionando Abilita parallasse.

Aggiungere immagini in evidenza

Per creare l'effetto parallasse, aggiungi un'immagine in evidenza alla pagina o sezione:

• Le immagini in evidenza aggiunte a una pagina creano un banner 
• Le immagini in evidenza aggiunte alle sezioni relative al contenuto dell'indice creano un'immagine di sfondo.

Se l'effetto parallasse non viene visualizzato, assicurati che sia abilitato.

Aumentare l'effetto

Esistono diversi modi per aumentare l'effetto pergamena con parallasse.

Contenuto misto

Mescolare le immagini a scorrimento di parallasse con contenuti e immagini che non scorrono in parallasse. Il contenuto che si muove più velocemente sembra scorrere sulle immagini con effetto parallasse.

Ad esempio, in un Indice è possibile combinare sezioni di contenuto a scorrimento con parallasse e sezioni di contenuto senza parallasse per l'Indice delle sezioni galleria, oppure con sezioni di contenuto che non presentano immagini di sfondo.

Aggiungi contenuto in sovrapposizione

Un altro modo per migliorare il parallax scrolling è l'aggiunta di testo, pulsanti o altro contenuto all'immagine come sovrapposizione. Questo contenuto scorre alla stessa velocità del resto della pagina, più velocemente dell'immagine. Nella famiglia Brine, è possibile aggiungere questo contenuto con i blocchi:

• Banner - Per aggiungere contenuti all'area introduttiva.
• Sezioni della pagina indice: aggiungere dei contenuti all'area corrispondente della pagina. 

Aggiungere un filtro colorato

Puoi aggiungere un filtro colore a tutti i banner del tuo sito con Colore in sovrapposizione, nella sezione Principale: sovrapposizione degli Stili del sito.

Ritagliare

Per capire come i ritagli influiscano sulle immagini con parallasse, pensa al sito come a un pezzo di carta con un foro rettangolare. L'immagine con parallasse è un livello separato e disposto sotto, visibile solo attraverso il foro nella carta.

Perché la carta scorra più velocemente dell'immagine, l'immagine deve essere più alta del foro. Lo spazio extra nella parte superiore e inferiore dell'immagine è ciò che viene rivelato quando si sposta la carta.

Per questo motivo, le modifiche al ritaglio e al punto focale potrebbero non avere un impatto notevole sulla posizione dell'immagine con scorrimento con parallasse. Il sito è progettato per garantire che l'immagine abbia margini sui lati in modo che possa far visualizzare l'effetto parallasse.

Suggerimento: seleziona Ritaglio intelligente parallasse negli Stili del sito per ridurre al minimo il ritaglio a sinistra e a destra.

Problemi di scorrimento

Se si verificano problemi di scorrimento quando l'effetto parallax è abilitato, potrebbe essere necessario ridurre le dimensioni della pagina. I browser possono caricare lentamente le pagine con parallax scrolling, soprattutto se le dimensioni complessive della pagina sono pari o superiori a 15 MB. Se lo scorrimento non sembra ancora corretto o se non è possibile ridurre le dimensioni della pagina, considera la possibilità di disabilitare l'effetto parallax.