Joomla und bewegliche Divs

Kategorie : Programming & Web

Eigentlich hat das gar nichts mit Joomla an sich zu tun, aber vielleicht rennt mal trotzdem jemand genau in dieselbe Falle wie ich.

Und zwar habe ich gestern ca. 3 wertvolle Stunden meines Lebens mit dem Versuch verbracht eine ganz simple Javascript-Sache, die bereits in einer blanken Testseite funktioniert, in eine Joomla-Komponente einzubauen.

Und zwar sollte folgendes passieren:
Ein Div ist beim Pageload ausgeblendet. Sobald man mit der Maus über ein bestimmtes Bildchen hovert, soll per onmouseover-Event das Div eingeblendet und in der Nähe des Mauszeigers gezeigt werden.

Wie gesagt .. das alles hatte schon in einer leeren Testseite hingehauen und sollte nun in eine Joomla-Komponente rein. Und da ging das ein- und ausblenden auch wunderbar, das verschieben des Divs zur Mausposition jedoch nicht.

Darum habe ich x-Mal am Javascript rumgespielt, das CSS genausooft umgebaut und sonstige Verrenkungen gemacht. Schließlich habe ich die Komponente so weit verstümmelt, dass sie wirklich nur noch das ausgegeben hat, was meine blanke Testseite auch geliefert hat … es ging immernoch nicht. Der einzige Unterschied zwischen den beiden Seiten war nur noch der DOCType …. und jetzt rate mal, was der Grund dieses Verhaltens war. Richtig!

Joomla gibt als Standard den Doctype <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> mit. Und dieser verhindert, dass ich die Positionsangaben des Divs mittels document.getElementById(“bla”).style.top/left verändern kann. Ich hab dann nur den Doctype rausgeschmissen .. und schon hat alles hingehauen.

Dass diese “Lösung” noch nicht das gelbe vom Ei ist, ist mir klar. Aber jetzt muss ich mich erst diesbezüglich schlau machen. Nach der gestrigen Odyssee was das angeht, hatte ich dazu echt keinen Bock mehr auf irgendwelche Doctypes …

EDIT:
Die Lösung war dann doch leichter als gedacht (man muss nur darauf kommen): Man kann Werte für document.getElementById(“bla”).style.top sehr wohl mit diesem DocType ändern … man muss nur explizit “px” als Einheit mit angeben, sondern wird das nicht erkannt :)

Schreibe ein Kommentar