Einzelnen Beitrag anzeigen
  #3 (permalink)  
Alt 22.06.2014, 14:48
MitjaStachowiak MitjaStachowiak ist offline
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 09.10.2010
Beiträge: 151
MitjaStachowiak befindet sich auf einem aufstrebenden Ast
Standard

Ich sehe das Problem eher darin, dass du immer um einen festen Wert verschiebst. Aber je nach Breite des Anzeigefensters ist die linke/rechte Ecke der mittleren Box wo anders.

Statt dieser ganzen jQuery-Methoden würde ich mal auf ein Paar native Befehle zurückgreifen. Mit offsetLeft und offsetWidth bekommst du die Pixelpositionen der Boxen. So kannst du mit jedem window.onresize die Position berechnen, die die Boxen haben müssen, wenn sie neben der mittleren Box sind.

Für die eigentliche Animation würde ich dann mit einem [0, 1]-Wert arbeiten.
Also:
Code:
linkeBox.style.left = - linkeBox.style.offsetWidth + mittlereBox.style.offsetLeft * s + urspruenlichePositionVonLinkerBox * (1-s) + 'px';
urspruenlichePositionVonLinkerBox ist dann im onload linkeBox.style.offsetLeft + linkeBox.style.offsetWidth;

Hier liegt s jetzt zwischen 0 und 1. Bei 0 ist die Box an ihrer alten Stelle, bei 1 neben der mittleren Box und für Werte dazwischen eben dazwischen.

Die Fragliche Zeile musst du jetzt eben im onresize und im onscroll aufrufen. Das s muss im onscroll berechnen werden.

Achja: Wenn die Boxen unterschiedliche offsetParents haben, kann die Berechnung mit offsetLeft falsch werden. Dann musst du noch mehr Code für die Positionsberechnung schreiben

Geändert von MitjaStachowiak (22.06.2014 um 14:51 Uhr)
Mit Zitat antworten