Verschiebbare Größe von Tabellenspalten in einer Tabelle.

[martinsig]

Hi @ all,
ich möchte in meiner Tabelle per Maus die Spaltengröße verschieben. Die HTML wurde mir webserverseitig generiert (jsf). Leider gibt es ja kein Objekt im DOM für diese Spalten rechts und links aussen in einer Spaltenüberschrift.
Mein Ansatz war. Ich holle mir alle Spalten, speichere mir die Bereiche zwischen den Spalten mit zusätzlichen 2 Pixeln in meinem Objekt (Position, Höhe, Breite). Ich höre auf mousemove und sobald die Maus darüber ist also in einem der Bereiche zwischen den Spaltenüberschrifen wechsel ich den Mousecursor (Pfeil rechts und links).
Das klappt wurderbar.
Ich höre also jetzt auf mousedown und wenn die maus zusätzlich über meinen Bereich ist merke ich mir das auch. Wird die maus also mit diesen zwei Argumenten bewegt (mousemove + mousedown und mouse ist im Bereich) so vergrößere / verkleinere ich meine Spalte (width)  entweder nach rechts oder nach links immer um einen Pixel. Ich dachte nämlich, dass der mousemove immer ein event pro Pixel schickt aber es funktioniert nicht richtig. Die Spalten werden irgendwie dann auf einmal groß oder klein.
Schickt das mousemove nur einen event pro Pixel? Wenn ich die Maus in meinem Bereich gedrückt habe würde ich das auch irgendwie gern blockieren. Momentan ist es so. Wenn ich mich im Bereich befinde und die Maus drücke, dann aus dem Bereich rausgehe switch diese wieder um.
Kennt vielleicht jemand einen anderen Lösungsansatz für das Problem. Verändern der Spaltengröße in einer Tabelle per Maus.
Vielen Dank.
Schöne Grüße
Martin

[Struppi]

Hi @ all,
ich möchte in meiner Tabelle per Maus die Spaltengröße verschieben. Die HTML wurde mir webserverseitig generiert (jsf). Leider gibt es ja kein Objekt im DOM für diese Spalten rechts und links aussen in einer Spaltenüberschrift.

Dein Ansatz ist gar nicht mal so schlecht, nur das mit demn Mauseevent ist falsch, dieser gibt immer die aktuelle Position, d.h. du musst immer die Differenz ermittlen.

Ich hab mal sowas ähnliches gemacht, vielleicht hilft das ein bisschen weiter:
http://javascript.jstruebig.de/test/tabellen ziehen.html
(funktioniert leidlich in FF und IE 6, in Opera gar nicht)

Struppi.

[plan_B]

Hallo,

Kennt vielleicht jemand einen anderen Lösungsansatz für das Problem. Verändern der Spaltengröße in einer Tabelle per Maus.

mousemove wird zwar gefeuert, wenn sich der Cursor um mindestens 1 Pixel verschiebt, aber die zurückgelegte Strecke musst du explizit abfragen.

Anlässlich eines anderen Postings habe ich auch mal ein wenig geforscht.
Da ging es u.a. darum überlange Zellinhalte in schmale Spalten zu stauchen.
Schon da verhalten sich die Browser unterschiedlich genug.

mein Css/Script ist auch nicht in jedem Browser überzeugend, einen praktischen Nutzen kann ich bei dieser Tabellenmanipulation auch nicht erkennen ...

table/table1.htm

Gruß plan_B