Überlappende Div-Boxen anordnen lassen

taris_gedar

Grünschnabel
Hallo an alle :)

Ich habe mir einen kleinen Kalender gebaut und hab ihn in den Stil des Outlook-Kalenders gehalten (einfach die beste Art, wie man es machen kann).
Jedenfalls funktioniert es soweit wunderbar. Jeder Termin wird als eine Div-Box farblich markiert und über eine Tabelle gelegt, die mit 24 Zeilen genau von 0 bis 23 Uhr den Tag anzeigt (das positionieren der Div-Boxen lasse ich von Javascript machen, dem ich per PHP die genaue Position des Termins, sowie Höhe und Breite gebe).

Mein einziges Problem ist jetzt nur noch, wie ich überlappende Termine behandel.
Ich kam auf die Idee, das man am besten nach der Positionierung noch eine Javascript-Funktion laufen lässt, die überlappende Boxen in der Breite verkleinert und dann entsprechend nebeneinander setzt. Die Höhe usw darf sich nicht ändern, da man ja damit grob die Zeiten von der Tabelle ablesen kann.

Ich hab schon das Internet durchforstet, aber hab leider nichts gefunden. Hat jemand von euch vielleicht eine Idee wie man so eine Funktion machen kann?
Sie muss die überlappenden Boxen erkennen und dementsprechend verkleinern und positionieren können.

Gruß!
 
Hallo,

könntest du das mal bspw. anhand einer Screenshots darstellen, ich habe mangels Outlook keine Ahnung, wie das dort aussieht.
 
Sorry, für die späte Antwort ..Ostern war doch anspruchsvoller als gedacht ;)

Anbei hab ich dir mal einen Screenshot gehängt. Ist noch ein wenig spartanisch, aber erfüllt seinen Zweck :)
Wie man sehen kann sind alle Termine schön untereinander, aber sobald ich 2 Termine zur selben Zeit habe, dann überschneiden sie sich.
Ich brauche nun ein Javascript, das prüft, ob sich Boxen überschneiden und diese dann nebeneinander setzt (Höhe darf sich nicht verändern ..nur Left und Width).

Eine Idee, wie ich sowas machen kann? ..danke im vorraus!
 

Anhänge

  • kalender.jpg
    kalender.jpg
    24,2 KB · Aufrufe: 46
Zuletzt bearbeitet:

Neue Beiträge

Zurück