Div im Bogen nach oben

ThiKool

Erfahrenes Mitglied
Hallo Leute,

ich möchte mit javascript ein Div animieren, das von einem bestimmten Startpunkt zu einem definierten Zielpunkt im Bogen wandern soll.

Zielpunkt ist immer:

X: 800px
Y: 100px

Startpunkt ist variabel.

Ich hab jetzt schon etwas mit Math.Sin und Cos experimentiert, allerdings schlägt der Bogen immer erst extrem nach links aus bevor er hoch geht.

Am liebsten wäre es mir, wenn das div erste eher hochwandert und dann nach rechts und eben nicht nach links ausschlägt, so wie auf der Zeichnung (Anhang).

Ausserdem hab ich da noch ein Problem mit dem variablen Startpunkt.

Irgendwie steh ich auf dem Schlauch (könnte allerdings auch mit meinen schlechten Mathekenntnissen zusammenhängen :))

Danke euch!
 

Anhänge

  • bogen.png
    bogen.png
    410 Bytes · Aufrufe: 9
Hi

Java!=JavaScript :rolleyes:
Bisher wusstest du das doch auch...

Wenn du deinen aktuellen Code herzeigst kann man dir am Besten helfen
 
Ok aber doch ein bisschen "schwer", da ich ja zusätzlich die jquery-ui laden muss.

Kann ich mir aus der UI nur den ease Part extrahieren - oder sollte ich doch eher mit CSS animieren?
 
Ok aber doch ein bisschen "schwer", da ich ja zusätzlich die jquery-ui laden muss.
Kann ich mir aus der UI nur den ease Part extrahieren - oder sollte ich doch eher mit CSS animieren?
Anscheinend gibt es auch ein easing-Plugin:
http://gsgd.co.uk/sandbox/jquery/easing/
Der Code ist leicht zu lesen und Du könntest außer den beiden sine-Easings alles andere löschen.
Oder Du stellst auf CSS um, dann kann es der Browser und Du brauchst gar kein Plugin.
 
Zuletzt bearbeitet:
http://easings.net/de bietet zudem eine Übersicht aller möglichen Übergangsfunktionen.

Ob sich die Animation mit CSS noch geschmeidiger gestalten lässt, müsste von @ThiKool in einem gesonderten Fall selbst getestet/überprüft werden.

Ich vermute aber eher nicht.
 
Zurück