JQuery - Animazione di diapositive della home page sul caricamento della pagina, ma solo una volta per ogni visualizzatore: jquery, slidedown, slideup

Qual è il modo migliore per far scivolare due div l'uno nell'altro. Fondamentalmente, ho diviso la mia homepage in due sezioni. Voglio che scivolino verso il basso e scivolino l'uno nell'altro, ma accadono solo una volta per ogni visualizzatore.

<div id="wrap">
<div id="slideDown">Slide down</div>
<div id="slideUp">Slide up</div>
</div>

risposte:

Dovrai utilizzare gli effetti di animazione di jQuery slideUp e slideDown (vedi la risposta di tandu) o semplicemente usa animate se ti senti più prolisso.

Ma, per impedire al browser di eseguire questa animazione in una visita di ritorno, dovrai memorizzare un cookie. plugin jquery-cookie è un buon punto di partenza. Fondamentalmente quello che vuoi fare è:

1. Verifica la presenza del cookie doNotLoadAnimation.
2. Se non presente, imposta il cookie doNotLoadAnimation e mostra l'animazione, altrimenti mostra la pagina senza l'animazione

Non sarà perfetto perché i cookie non sono una forma di conservazione persistente, ad es. se un utente cancella i propri cookie, l'animazione verrà eseguita nuovamente.

Spero possa aiutare!

jQuery "s .slideUp e .slideDown nascondere e mostrare i contenuti facendo scorrere, rispettivamente. In modo da avere .slideUp mostra effettivamente il contenuto, devi usare l'effetto di visualizzazione dell'interfaccia utente jQuery per la diapositiva, come in:

$("#slideUp").show( "slide", {direction: "up"} );

È difficile dire esattamente cosa vuoi, e se semplicemente incolli quello che ho lì (supponendo che tu abbia gli UI degli effetti) si innescherà solo una volta per ogni vista.