intelliTXT?

[Wonderland]

Hi!

Man kennt ja sicher (leidvoll) 'IntelliTXT' aus Foren. Ich habe inzwischen festgestellt, daß das Ding mit JavaScript funktioniert.

Die Werbeeinblendungen sind ziemlich nervig, aber ich dachte mir, die Technik könnte auf einer privaten Webseite vielleicht recht nützlich sein. Worauf ich hinaus will: Ich würde gerne Links, die auf Seiten ausserhalb meiner eigenen Webseite verweisen mit einer kleinen Beschreibung versehen, die erscheint, wenn man mit der Maus darüberfährt. Oder einen Screenshot der Seite. Oder eine Grafik mit der Beschreibung.

Wie funktioniert also IntelliTXT? Oder anders gefragt: Wie kann ich sowas relativ simpel selbst machen (natürlich OHNE die Werbung)? Weitere Frage: Ich habe mal etwas ähnliches auf einer englischen (co.uk?) CSS-Webseite gesehen, aber halt in CSS ohne JavaScript - was ich viel besser finde. Geht das also mit reinem CSS? Wie kann ich etwas "über den Text legen" wie bei IntelliTXT, wenn möglich aber nur mit reinem CSS?

Über Beschreibungen, Lösungsvorschläge und vor allem Links zu diesen Fragen würde ich mich sehr freuen.

[Mathias Brodala]

Hallo Wonderland.

Ich würde gerne Links, die auf Seiten ausserhalb meiner eigenen Webseite verweisen mit einer kleinen Beschreibung versehen, die erscheint, wenn man mit der Maus darüberfährt.

Dann verwende das http://de.selfhtml.org/html/attribute/allgemeine.htm#uebersicht@title=title-Attribut oder die Infobox.

Oder einen Screenshot der Seite. Oder eine Grafik mit der Beschreibung.

Dies lässt sich nur mittels Infobox (oder einem vergleichbaren Konstrukt) verwirklichen.

Den Screenshot erstellst du am besten selbst, auch wenn dies rein theoretisch automatisierbar wäre. (Indem auf Anfrage per kwebdesktop ein Screenshot erstellt, die resultierende Datei eingelesen und base64-kodiert und diese Zeichenkette als Inline-Grafik über eine AJAX-basierte Übertragung ins Dokument eingefügt wird.)

Einen schönen Montag noch.

Gruß, Mathias

[Wonderland]

Hallo Mathias!

Ok, die Infobox sieht ja an sich schon ganz nett aus... Kann ich die <div>-Deklarationen, etc. im hover auch mit before/after realisieren, so daß ich nur '<a href="http://..." id="xyz">blabla</a>' im Dokument habe?

Weitere Frage: Wie wird das denn in laufendem Text angezeigt? Liegt das dann "über" dem restlichen Text? Wenn nicht, dann wäre das Beispiel unbrauchbar. Ich brauche halt ein Overlay, wenn man es so nennen möchte.

Den Screenshot erstellst du am besten selbst

Ja, hätte ich vielleicht dazusagen sollen, daß ich das so vorhabe. Aber danke für die andere Möglichkeit, die werde ich auch mal recherchieren. Klingt jedenfalls gut.

Gruß,

• Wonderland

[wahsaga]

hi,

Ok, die Infobox sieht ja an sich schon ganz nett aus... Kann ich die <div>-Deklarationen, etc. im hover auch mit before/after realisieren, so daß ich nur '<a href="http://..." id="xyz">blabla</a>' im Dokument habe?

Mit :before/:after müsstest du für jeden Link individuelle Regeln definieren, wenn du nicht auf bereits vorhandenen Inhalt - bspw. den Inhalt eines title-Attributes zurückgreifen willst.
Außerdem versteht das der IE nicht.

Weitere Frage: Wie wird das denn in laufendem Text angezeigt? Liegt das dann "über" dem restlichen Text?

Das hängt davon ab, mit welchen Formatierungen du es ausstattest.

gruß,
wahsaga

[Wonderland]

Ok, also offensichtlich komme ich mit reinem CSS da so nicht weiter.

Wie kann ich das, was IntelliTXT macht, recht einfach per JavaScript implementieren? Ich habe nahezu keine Ahnung von JavaScript (nur HTML, CSS und ein wenig PHP).

[Mathias Brodala]

Hallo Wonderland.

Ok, also offensichtlich komme ich mit reinem CSS da so nicht weiter.

Wie kann ich das, was IntelliTXT macht, recht einfach per JavaScript implementieren?

Am einfachsten ließe sich dies mittels http://de.selfhtml.org/javascript/objekte/all.htm#inner_html@title=innerHTML und der http://de.selfhtml.org/javascript/objekte/string.htm#replace@title=replace-Methode umsetzen.

Hierbei solltest du als erstes http://de.selfhtml.org/javascript/objekte/string.htm#index_of@title=indexOf verwenden, um herauszufinden, ob das zu verlinkende Wort überhaupt im innerHTML des jeweiligen Elementobjektes enthalten ist. Ist dem so, kannst du es einfach durch sich selbst zuzüglich umliegendem Link ersetzen.

Zugriff auf das jeweilige Elementobjekt könntest du dir per http://de.selfhtml.org/javascript/objekte/document.htm@title=getElement*-Methoden holen.

Einen schönen Dienstag noch.

Gruß, Mathias