Hallo,
ich habe ein 2spaltiges Layout mit füllenden Bildern. Die bilder sind nach Links gefloatet und haben alle eine width von 50%, dh pro Zeile sind 2 gleichgroße Bilder zu sehen.
Nun kann man via Filter einzelne Bilder ein- und alle anderen ausblenden lassen (bsp Klick auf Thema 1: alle Bilder, die damit gekennzeichnet sind, bleiben/tauchen auf, die anderen verschwinden). Dieser Filter funktioniert soweit auch.
Das Problem ist, dass das noch ziemlich unschön aussieht. Momentan wird bei Klick auf einen der Filter-Tags bei den entsprechenden Bildern entweder eine fadeIn() oder fadeOut() Animation von jQuery benutzt. Das hat folgendes Problem: Sobald ein Bild ausgefadet ist, wird dessen display durch die Funktion auf 0 gestellt, dh alle anderen Bilder rutschen schlagartig nach. Ich hätte gerne, dass sie das mit einer Bewegungsanimation machen.
Frage 1: Wie erreiche ich, dass die Bilder nicht sofort nachrutschen, sondern sich per Animation bewegen? Ohne absolute Positionierung nicht möglich, oder?
Frage 2: Was mache ich, wenn ein Bild dadurch von links unten nach rechts oben "rutschen" würde? Dann würde der direkte Bewegungspfad ja diagonal sein.
Ich habe schon angefangen, eine Lösung zu skizzieren, die ist aber extrem kompliziert, da jedes Bild je nach aktueller Position und zielposition sich abwechselnd nach rechts und/oder oben verschiebt, bis es sein ziel erreicht. Die Umsetzung würde jedenfalls sehr viel Zeit in Anspruch nehmen. Vielleicht geht es ja auch einfacher?
ich habe ein 2spaltiges Layout mit füllenden Bildern. Die bilder sind nach Links gefloatet und haben alle eine width von 50%, dh pro Zeile sind 2 gleichgroße Bilder zu sehen.
Nun kann man via Filter einzelne Bilder ein- und alle anderen ausblenden lassen (bsp Klick auf Thema 1: alle Bilder, die damit gekennzeichnet sind, bleiben/tauchen auf, die anderen verschwinden). Dieser Filter funktioniert soweit auch.
Das Problem ist, dass das noch ziemlich unschön aussieht. Momentan wird bei Klick auf einen der Filter-Tags bei den entsprechenden Bildern entweder eine fadeIn() oder fadeOut() Animation von jQuery benutzt. Das hat folgendes Problem: Sobald ein Bild ausgefadet ist, wird dessen display durch die Funktion auf 0 gestellt, dh alle anderen Bilder rutschen schlagartig nach. Ich hätte gerne, dass sie das mit einer Bewegungsanimation machen.
Frage 1: Wie erreiche ich, dass die Bilder nicht sofort nachrutschen, sondern sich per Animation bewegen? Ohne absolute Positionierung nicht möglich, oder?
Frage 2: Was mache ich, wenn ein Bild dadurch von links unten nach rechts oben "rutschen" würde? Dann würde der direkte Bewegungspfad ja diagonal sein.
Ich habe schon angefangen, eine Lösung zu skizzieren, die ist aber extrem kompliziert, da jedes Bild je nach aktueller Position und zielposition sich abwechselnd nach rechts und/oder oben verschiebt, bis es sein ziel erreicht. Die Umsetzung würde jedenfalls sehr viel Zeit in Anspruch nehmen. Vielleicht geht es ja auch einfacher?
