Seite animieren -jQuery

bbm1

Grünschnabel
Hallo zusammen

Ich habe lange überlegt, und ich hoffe hier passt die Thema?

Ich würde gerne einen Logo sozusagen über die ganze Seite "zeigen" lassen, links und rechts kommt noch die Navigation (je 2 == 4 Buttons) das alles sollte animiert sein, also Logo sollte am Anfang als Explosion erscheinen und ein paar Sekunden später sollten die Buttons sichtbar sein.

Siehe Foto 1

(Das sollte Logo darstellen, von oben bis unten....1.min Arbeit)

web1.png


Und wenn jemand auf einen Button klickt (egal links oder rechts) dann sollte sich der Logo um 180 Grad drehen und der Inhalt (News, Gallery, Kontaktformular..) sollten im Rahmen von der Logo erscheine.

Siehe Foto 2

web2.png




Und das alles noch in einem CMS bzw. in WordPress (weil die News sollten editierter sein + 10 Mitglieder (Accounts erstellen für geschützten Bereich)

Hier noch eine Bild was ich möchte erstellen (grob) http://postimg.org/image/xnrcn13qd/

Ich habe Logo im .AI Format (Illustrator)


Meine Fragen:
- Wie kann ich das am besten realisieren, mir ist klar für die Animationen am besten jQuery benutzen, die Frage ist welche Animationen und wie ....habe leider so etwas mit Bilder nie gemacht ...wie anfangen ?

- Ist das mir jQuery gut kombinierbar oder soll ich andere Animationen nehmen ?

Danke ;)
 
Hallo bbm1

Wie genau stellst du dir die Explosionsanimation vor? Eine Explosion braucht man oft halt eher zum ausblenden eines Elements, indem man es in kleine Stücke explodieren lässt, die dann verschwinden. Hast du vielleicht ein Beispiel, das dem was du als Animation haben willst ungefähr entspricht?

Viele Grüsse
Cromon
 
Hallo Cromon,

Es muss nicht zwingend "Explosions" sein, es kann auch eine andere schöne Effekt sein (eben wenn die Webseiten aufgerufen wird) leider kenne ich nicht viele verschiedene Effekte, deswegen haben ich geschrieben "sollte als Explosion erscheinen", aber ich bin auch für andere Effekten offen. :)
 
Hallo,
ich würde dir raten die Seite erst einmal ohne Animation aufzubauen. Auch weil es sich ja um ein CMS handeln soll.
Wenn das funktioniert kannst du dir Gedanken um die Animation machen.

So wie ich das sehe musst du die Inhalte per AJAX versteckt laden um dann im folgenden Schritt z.B. das Schild zu drehen.


Grüße
 
@SpiceLab kann man die Effekte auch für Bilder (Logo) benutzen, wie verhaltet sich nachher ....werde ich ausprobieren...

@Jan-Frederik Stieler ich habe gedacht, eine bestehende WP Theme bearbeiten (oder selber erstellen, ist k.p) und dann sozusagen bei leee Seite mit nur div's anfangen die Animation per jQuery ..und ev. AJAX um die Unterseiten laden zu können.
 
Hi,
grundsätzlich ist dir die Herangehensweise selbst überlassen, aber ich bin der Meinung das keine Seite rein auf Animationen funktionieren sollte.
Deshalb würde ich das Template erst einmal ohne diese Animation und Ajax bauen. Dann kannst du dir nämlich sicher sein das sie auch so funktioniert.

Auch wenn du das wahrscheinlich so nicht meinst, aber bitte verwende nicht nur divs :), sondern entsprechend semantische Elemente.
Divs nur dort wo es keine entsprechenden HTML-Elemente gibt.

Grüße
 

Neue Beiträge

Zurück