/ / JQuery - Homepage-Folienanimation beim Laden der Seite, jedoch nur einmal pro Viewer - Jquery, Slidedown, Slideup

JQuery - Homepage Folie Animation beim Laden der Seite, aber nur einmal für jeden Betrachter - jquery, slidedown, slideup

Was ist der beste Weg, um zwei Divs ineinander zu schieben. Grundsätzlich teile ich meine Homepage in zwei Bereiche auf. Ich möchte, dass sie nach unten rutschen und ineinander gleiten, aber nur einmal für jeden Zuschauer.

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

Antworten:

1 für die Antwort № 1

Sie müssen die Animationseffekte von jQuery verwenden slideUp und slideDown (siehe Antwort von Tandu) oder einfach verwenden animate wenn Sie sich wortreicher fühlen.

Um zu verhindern, dass der Browser diese Animation bei einem erneuten Besuch ausführt, müssen Sie ein Cookie speichern Jquery-Cookie-Plugin ist ein guter Startplatz. Grundsätzlich möchten Sie Folgendes tun:

  1. Prüfen Sie, ob ein doNotLoadAnimation-Cookie vorhanden ist.
  2. Falls nicht vorhanden, setzen Sie das doNotLoadAnimation-Cookie und zeigen Sie die Animation an. Anderenfalls wird die Seite ohne Animation angezeigt

Es wird nicht perfekt sein, da Cookies keine dauerhafte Speicherung sind, z.B. Wenn ein Benutzer seine Cookies löscht, wird die Animation erneut ausgeführt.

Ich hoffe, das hilft!


1 für die Antwort № 2

jQuery "s .slideUp und .slideDown verstecken bzw. zeigen Sie den Inhalt durch Schieben. Um zu haben .slideUp Um Inhalte anzuzeigen, müssen Sie den jQuery-UI-Effekt für die Folie verwenden, wie in:

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

Es ist jedoch schwierig, genau zu sagen, was Sie wollen, und wenn Sie einfach das einfügen, was ich dort habe (vorausgesetzt, Sie haben die Effekt-Benutzeroberfläche), wird es nur einmal für jede Ansicht ausgelöst.