Hello Leute,
Ich habe heute Mittag mal geschaut, ob - und wenn ja, wie - ich an ein Wort komme, auf das ich mit dem Mauszeiger zeige. Ich habe mir natürlich vorher selbst Gedanken dazu gemacht; aber jedes einzelne Wort in ein span zu packen und dann über (mouseover) e.target.innerHTML
zu gehen erscheint mir alles andere als elegant.
So stieß ich also auf document.caretPositionFromPoint
(Firefox). Ich habe dann auch ein Anwendungsscript gefunden und gleich bei meinem neuen Projekt eingefügt. - und es fliegt mir teilweise um die Ohren (fehlerhafte Resultate).
Als ich euch ein Online-Beispiel zusammengehämmert habe, habe ich einen möglichen Grund gefunden, weswegen es nicht richtig funktioniert: in dieser Version des Beispiels funktioniert es fehlerhaft, aber wenn ihr den Punkt display: block
bei span im CSS löscht funktioniert es wunderbar.
Zuerst hatte ich vermutet, dass der Wert von e.clientX
durch die Eigenschaft transform: translateX(-50%)
zu dem eigentlichen Fehlverhalten führt (was es auch zum Teil tut; addiert man die 50% der Weite zum e.clientX
hinzu kommt größtenteils das richtige Ergebnis raus). Aber spätestens, wenn z.B. ein <i> im Code enthalten ist führt es zu einem - mir - unerklärlichen Verhalten: der Anfang der Zeile, in der sich das <i> befindet bis einschließlich dem Inhalt von <i> wird nicht erkannt. Ab dem nächsten Wort aber funktioniert es wieder...
Alles ist gut, solange span ein inline Element ist - aber warum? Mit block und inline-block klappt's nicht.
Gibt es mit dieser Funktion im Code und einem display: block
irgendeine Perspektive für dieses Vorhaben? Irgendwelche Ideen wie ich mit dieser Funktion dennoch nicht auf die Eigenschaften von display: block
verzichten muss?
Habt ihr irgendwelche Vorschläge, wie ich sonstnoch an das Wort, auf dem sich der Cursor befindet, komme?
Reinhard