LX: Tabellenspaltenbreite dynamisch ändern - mouseover/js-hover/css

Beitrag lesen

Stecke in die Tabellenspalten zusätzliche Elemente mit display:block, damit das overflow:hidden so funktioniert wie geplant.

Bei den Browsern, die :hover auch bei anderen als Linkelementen unterstützen (eine typische Schwachstelle bei älteren IE-Versionen) dürfte es auch allein mit CSS klappen.

Alternativ kannst Du auch die Klasse .hover per JavaScript vergeben. In diesem Fall solltest Du die Events aber mit einem Script verteilen und nicht ins HTML schreiben, bspw.

var tablecells = document.getElementById('aTable').getElementsByTagName('td');
var t = tablecells.length;
while (t--) {
   tablecells[t].onmouseover = function() { this.className = 'hover'; }
   tablecells[t].onmouseout = function() { this.className = ''; }
}

Das ist natürlich noch sehr krude - ggf kannst Du statt der td-Elemente auch gleich die innenliegenden divs nehmen, da auf diese Weise Probleme mit fehlendem Bubbling vermieden werden können.

Gruß, LX

--
RFC 1925, Satz 6a: Es ist immer möglich, einen weiteren Umweg einzufügen.
RFC 1925, Satz 11a: Siehe Regel 6a