Hi zusammen,
ich habe folgende Aufgabe zu lösen:
Für ein Programm soll ich eine Art interaktive Dokumentation mit Html/Javascript erstellen.
Das heißt es stehen mir Screenshots der einzelnen Fenster/Seiten/Funktionen des Programms zu Verfügung.
Dabei soll dann je ein Screenshot genommen werden und bei Mousover von bestimmten Teilen des Bildes (z.B. eines Buttons) eine Infobox mit einer Erläuterung erscheinen. So weit so gut.
Mein Problem ist, dass die Erläuterung teilweise auch XML enthälten, weshalb ich zur Zeit für den Inhalt der Infoboxen die innerText-Funktion nutze, damit die Tags nicht geschluckt werden.
Dadurch lässt sich der ganze Text aber leider nicht mehr formatieren. Weder \n, \r oder andere gängige Varianten bringen eine Veränderung in der Infobox.
Hat jemand eine Idee wie sich das Problem lösen lässt? Verwende ich die textContent-Funktion, lässt sich der Text zwar formatieren, aber sämmtliche XML-Tags werden geschluckt.
Ansonsten ist mein allgemeiner Ansatz, dass ich die Mousoverflächen mit area-Tags definiere und dort eine Javascript-Funktion für die Anzeige der Infobox ausführe.
Diese ist vorher bereits durch CSS definiert und wird dann nur noch mit Inhalt gefüllt, an die richtige Position und auf visible gesetzt.
Kann man das so machen oder gibt es eurer Meinung nach eine elegantere Lösung dafür?
Vielen Dank schon mal für eure Hilfe.
PS: Leider habe ich die relevanten Codestücke grade nicht parat, kann sie aber später gerne noch einfügen.
ich habe folgende Aufgabe zu lösen:
Für ein Programm soll ich eine Art interaktive Dokumentation mit Html/Javascript erstellen.
Das heißt es stehen mir Screenshots der einzelnen Fenster/Seiten/Funktionen des Programms zu Verfügung.
Dabei soll dann je ein Screenshot genommen werden und bei Mousover von bestimmten Teilen des Bildes (z.B. eines Buttons) eine Infobox mit einer Erläuterung erscheinen. So weit so gut.
Mein Problem ist, dass die Erläuterung teilweise auch XML enthälten, weshalb ich zur Zeit für den Inhalt der Infoboxen die innerText-Funktion nutze, damit die Tags nicht geschluckt werden.
Dadurch lässt sich der ganze Text aber leider nicht mehr formatieren. Weder \n, \r oder andere gängige Varianten bringen eine Veränderung in der Infobox.
Hat jemand eine Idee wie sich das Problem lösen lässt? Verwende ich die textContent-Funktion, lässt sich der Text zwar formatieren, aber sämmtliche XML-Tags werden geschluckt.
Ansonsten ist mein allgemeiner Ansatz, dass ich die Mousoverflächen mit area-Tags definiere und dort eine Javascript-Funktion für die Anzeige der Infobox ausführe.
Diese ist vorher bereits durch CSS definiert und wird dann nur noch mit Inhalt gefüllt, an die richtige Position und auf visible gesetzt.
Kann man das so machen oder gibt es eurer Meinung nach eine elegantere Lösung dafür?
Vielen Dank schon mal für eure Hilfe.
PS: Leider habe ich die relevanten Codestücke grade nicht parat, kann sie aber später gerne noch einfügen.
Zuletzt bearbeitet: