Marc: Scrollen mittels quadratischer Funktion

Hallo,

ich hoffe, hier kann mir jemand helfen, da mein Problem teils programmierbasiert ist und hier die Leute ein teils recht breites Spektrum an Wissen haben.

Es geht um folgendes. Ich möchte per JS ein Objekt von oben nach unten scrollen lassen.
Es soll einen Beschleunigungs- und einen Abbrems-Effekt geben.
Es gibt eine festgelegte Distanz.
Die Distanz hat einen geraden Wert.
Es gibt einen Wert, in wie vielen Schritten das ganze geschehen soll.

Das ganze basiert auf einer umgekehrten Normalparabel ((x²)*(-1))
Ich stehe gerade auf dem Schlauch.

Und zwar habe ich mir das etwa so vorgestellt:

Man übergibt einer JS-Funktion drei Werte:
Die Distanz dist, die Anzahl der Schritte steps und den Stauchfaktor fact

Dann ist ja die allgemeine Funktion für x²:

((x - dist/2)²)*(-1)

(umgekehrte Normalparabel um die Hälfte der Distanz nach rechts verschoben)

Ich hoffe bis hier gibt es keine Denkfehler.

Das eigentliche Problem entsteht jetzt: Ich würde jetzt gerne irgendwie ein Array zurückbekommen, dass die Werte enthält, die z.B. ein margin erhält um so den Scrolleffekt zu erzeugen...
Bloß wie mache ich das?
Es geht darum, dass die Werte des Arrays natürlich nur von 0 bis distance gehen dürfen und das kriege ich nicht hin..

  1. Hello out there!

    Es soll einen Beschleunigungs- und einen Abbrems-Effekt geben.

    Also Anfangs- und Endgeschwindigkeit 0?

    Und wie groß soll die Beschleunigung/Verzögerung sein?

    Es gibt eine festgelegte Distanz. […]
    Es gibt einen Wert, in wie vielen Schritten das ganze geschehen soll.

    Das sind zwei Parameter; für eine quadratische Funktion brauchst du drei.

    Das ganze basiert auf einer umgekehrten Normalparabel ((x²)*(-1))

    Warum _Normal_parabel? Warum nicht ax² + bx + c?
                                       ▲
    Und nein, wenn du erst beschleunigst und dann abbremst, hast du zwei Teile in deiner Ortsfunktion: einen nach unten geöffneten Parabelast und einen nach oben geöffneten.

    See ya up the road,
    Gunnar

    --
    “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
    1. Hallo Gunnar,

      kurzer Zwischenruf, wie hast du dieses Ding ▲ gemacht?

      Gruß,

      Dieter

      1. Hallo Dieter.

        kurzer Zwischenruf, wie hast du dieses Ding ▲ gemacht?

        Ganz gewiss kopiert.

        Einen schönen Donnerstag noch.

        Gruß, Mathias

        --
        sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
        „It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
        [HTML Design Constraints: Logical Markup]
        1. Hello out there!

          kurzer Zwischenruf, wie hast du dieses Ding ▲ gemacht?

          Ganz gewiss kopiert.

          Ganz gewiss. ;-)

          See ya up the road,
          Gunnar

          --
          “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
          1. Hallo Gunnar,

            Mit allen Wassern gewaschen, was soll man da noch sagen ;-)

            Gruß,

            Dieter

          2. Tach Gunnar,

            Ganz gewiss. ;-)

            Du solltest Dein Unicode-Tool aber noch etwas feintunen. Das leere span-Element <span id="character" /> hat kein firstChild, auch wenn das vielleicht Firefox offenbar trotzdem wie gewünscht behandelt. IE und Opera handeln AFAIK richtig.

            Entweder dem span-Element vorab einen beliebigen Inhalt zuweisen und dann ersetzen oder beim Anbinden der Funktion mittels createTextNode() einen neuen Textknoten erzeugen und in den DOM-Baum einhängen.

            Man liest sich,
            svg4you

            1. Hello out there!

              Du solltest Dein Unicode-Tool aber noch etwas feintunen.

              Ja, das ist ein quick and dirty working draft. Äußerst unschon, dass bei der Ausgabe nur das Zeichen, aber nicht mehr die Unicode-Nummer zu sehen ist.

              Das leere span-Element <span id="character" /> hat kein firstChild

              Danke für den Hinweis.

              See ya up the road,
              Gunnar

              --
              “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
    2. Hello out there!

      Es soll einen Beschleunigungs- und einen Abbrems-Effekt geben.
      Also Anfangs- und Endgeschwindigkeit 0?

      Nehmen wir das an, [latex]v_0 = 0[/latex]

      Und wie groß soll die Beschleunigung/Verzögerung sein?

      Nehmen wir an, Beschleunigung und Verzögerung sollen gleichen Betrag haben (*), das vereinfacht die Rechnung.

      Es gibt eine festgelegte Distanz. […]

      Die Bewegung solle in der Höhe [latex]y_0[/latex] beginnen und in der Höhe [latex]y_\mathrm{E}[/latex] enden.

      Es gibt einen Wert, in wie vielen Schritten das ganze geschehen soll.

      Die Bewegung soll zum Zeitpunkt [latex]t_0 = 0[/latex] beginnen und zum Zeitpunkt [latex]t_\mathrm{E}[/latex] enden.

      Die Bewegungsgleichung für die gleichmäßig beschleunigte Bewegung ist (Wenn ich rechne...)
      [latex]y \left( t \right) = \frac{1}{2} a t^2 + v_0 t + y_0 = \frac{1}{2} a t^2 + y_0[/latex]

      Das sind zwei Parameter; für eine quadratische Funktion brauchst du drei.

      Passt schon: [latex]v_0 = 0[/latex], [latex]y \left( 0 \right) = y_0[/latex] und das:

      Wegen (*) erfolgt die Beschleunigung genau bis zur Hälfte der Zeit [latex]0 \le t \le \frac{1}{2} t_\mathrm{E}[/latex]

      Dabei wird die Hälfte des Weges zurückgelegt:
      [latex]y \left( \frac{1}{2} t_\mathrm{E} \right) = y_0 + \frac{1}{2} \left( y_\mathrm{E} - y_0 \right)[/latex]

      Das eingesetzt ergibt
      [latex]y \left( \frac{1}{2} t_\mathrm{E} \right) = \frac{1}{2} a \cdot \left( \frac{1}{2} t_\mathrm{E} \right)^2 + y_0 = y_0 + \frac{1}{2} \left( y_\mathrm{E} - y_0 \right)[/latex]

      [latex]\frac{1}{2} a \cdot \frac{1}{4} t_\mathrm{E}^2 = \frac{1}{2} \left( y_\mathrm{E} - y_0 \right)[/latex]

      [latex]a = 4 \cdot \frac{y_\mathrm{E} - y_0}{t_\mathrm{E}^2}[/latex]

      Die Beweungsgleichung für den ersten Teil heißt also
      [latex]y \left( t \right) = \frac{1}{2} \cdot 4 \cdot \frac{y_\mathrm{E} - y_0}{t_\mathrm{E}^2} t^2 + y_0 = 2 \left( y_\mathrm{E} - y_0 \right) \left( \frac{t}{t_\mathrm{E}} \right)^2 + y_0[/latex]

      Und nein, wenn du erst beschleunigst und dann abbremst, hast du zwei Teile in deiner Ortsfunktion: einen nach unten geöffneten Parabelast und einen nach oben geöffneten.

      Die Gleichung für den zweiten Parabelast (die Verzögerung) für [latex]\frac{1}{2} t_\mathrm{E} < t \le t_\mathrm{E}[/latex] überlasse ich dir.

      See ya up the road,
      Gunnar

      --
      “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
      1. Erstmal danke für deine Mühe. Das weiß ich echt zu schätzen.

        Ich habe jetzt mal probehalber in deine Bewegungsgleichung meine Werte eingesetzt:

        t_0 = 0
        t_E = 10

        Y_0 = 0
        Y_E = 360  (Hälfte von 720)

        Dann bekomme ich aber diese Werte heraus:

        Y(0) = 0
        Y(1) = 7,2
        Y(2) = 28.8
        Y(3) = 64,8
        Y(4) = 115,2
        Y(5) = 180

        Das ergibt in der Summe allerdings 396

        Komisch ist, dass die Summe von Y(1) und Y(2) genau die Differenz zu Y_E ergibt. Zufall?

        ...Ich bin sooooo schlecht...

        1. Hello out there!

          t_0 = 0
          t_E = 10

          Y_0 = 0
          Y_E = 360  (Hälfte von 720)

          Y(0) = 0
          Y(1) = 7,2
          Y(2) = 28.8
          Y(3) = 64,8
          Y(4) = 115,2
          Y(5) = 180

          Das ergibt in der Summe allerdings 396

          Warum Summe?

          Die y(t) sind nicht die Werte, um _wieviel_ pro Zeitschritt gescrollt wird (das wäre ja dann die Geschwindigkeit), sondern _wohin_ (der Ort, eben der y-Wert auf dem Bildschirm).

          Deshalb ist ja y(5) auch die Hälfte von y_E = y(10).

          Komisch ist, dass die Summe von Y(1) und Y(2) genau die Differenz zu Y_E ergibt. Zufall?

          Ohne lange drüber nachzudenken würd ich sagen ja.

          See ya up the road,
          Gunnar

          --
          “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)