Supportnet / Forum / Webseiten/HTML
Wort hinterlegen
Frage
Hallo Leute,
Ich suche eine elegante Lösung (möglichst CSS) für folgendes Problem:
Ich benutze Fachwörter in Texten, die beim Drüberfahren mit der Maus erklärt werden sollen.
Beispiel:
[code]
Um nicht ständig die
<span title="Methode, um das Sinken beim Gleitschirm zu erhöhen">
Ohren anlegen
</span>
zu müssen ...
[/code]
Ich würde gerne das Fachwort mit einem schwach kontrastierenden Hintergrund versehen. Das ginge natürlich mit einer festen Farbvergabe, deren Farbe man für die jeweilige Stelle händisch ermitteln müsste. Das kann ich, kein Problem. Ich hätte es aber lieber so, dass es eine Generallösung für jede beliebige Hintergrundfarbe gäbe, da dieses Feature für hunderte von Seiten mit ganz unterschiedlichen Hintergrundfarben geplant ist. Also eine definierte Abweichung von der Hintergrundfarbe. Es würde mir reichen, wenn es eine Lösung für MSIE und Firefox gäbe, notfalls auch nur für MSIE.
Gruß
Manfred
Antwort 1 von Friedel
Geht es darum, um einen bestimmten Betrag von der Hintergrundfarbe der aktuellen Seite ab zu weichen? Oder gibt es Hintergrundbilder, und es soll um einen Bestimmten Betrag vom Farbwert an der aktuellen Stelle abgewicjhen werden? Ersteres ist möglich, letzters nicht. Sowas sollte problemlos in IE ab Version 5, Opera ab Version 6, Mozilla ab Version 1, Netscape ab Version 6 gehen. Aber alles nur mit aktiviertem JavaScript.
Antwort 2 von abschweb
@Friedel
Ist mir klar, wo dies Feature über einem Hintergrundbild auftauchen sollte, gehts nur mit Handarbeit. Lassen wir das mal beiseite.
Also nur Hintergrundfarbe.
Hast du eine Idee?
Gruß
Manfred
Ist mir klar, wo dies Feature über einem Hintergrundbild auftauchen sollte, gehts nur mit Handarbeit. Lassen wir das mal beiseite.
Also nur Hintergrundfarbe.
Hast du eine Idee?
Gruß
Manfred
Antwort 3 von rfb
für alle span-Bereiche die Hintergrundfarbe abfragen und ein bisschen ändern.
Theoretisch machbar. Allerdings erhältst du keinen Ausgangswert, wenn der span-Bereich einfach den Farbwert des Elternelements übernimmt (was die Regel sein dürfte). Dann könntest du noch mit parentnode auf das Eltern-(oder Großeltern-)element zugreifen.
Allerdings ist für deinen Fall folgendes üblicher:
Ich glaub Firefox hat das so sogar in den CSS-Voreinstellungen (vielleicht nicht für span, aber zumindest für acronym&Co).
Theoretisch machbar. Allerdings erhältst du keinen Ausgangswert, wenn der span-Bereich einfach den Farbwert des Elternelements übernimmt (was die Regel sein dürfte). Dann könntest du noch mit parentnode auf das Eltern-(oder Großeltern-)element zugreifen.
Allerdings ist für deinen Fall folgendes üblicher:
span[title] { border-bottom:thin dotted; }
Ich glaub Firefox hat das so sogar in den CSS-Voreinstellungen (vielleicht nicht für span, aber zumindest für acronym&Co).
Antwort 4 von abschweb
Es soll exakt so aussehen (ich teste mit IE und Firefox) wie in
http://www.abschweb.de/aktuell/190605.htm
und zwar Feinversion (klicke auf den Schriftzug "abschweb").
Es geht also darum, ob es eine weniger aufwändige Lösung gibt. An der Optik mache ich keine Abstriche, lieber löse ich es so wie dort, Seite für Seite.
In der Grobversion werde ich die mittelgraue Hinterlegung beibehalten.
Gruß
Manfred
http://www.abschweb.de/aktuell/190605.htm
und zwar Feinversion (klicke auf den Schriftzug "abschweb").
Es geht also darum, ob es eine weniger aufwändige Lösung gibt. An der Optik mache ich keine Abstriche, lieber löse ich es so wie dort, Seite für Seite.
In der Grobversion werde ich die mittelgraue Hinterlegung beibehalten.
Gruß
Manfred
Antwort 5 von rfb
Zitat:
klicke auf den Schriftzug "abschweb"
den finde ich dort nicht - meine Bequemlichkeits- und Sicherheitseinstellungen lassen aber auch nicht alle Spielereien zu und ohne die ist die Seite fast leer.klicke auf den Schriftzug "abschweb"
Antwort 6 von abschweb
@rfb
Verhinderst du Javascript?
Dann kannst du tatsächlich nicht viel sehen.
Für dich gäbe es die Sparversion (www.abschweb.de/spar/190605.htm),
aber dort ist das hier diskutierte Feature nicht vorgesehen.
Gruß
Manfred
Verhinderst du Javascript?
Dann kannst du tatsächlich nicht viel sehen.
Für dich gäbe es die Sparversion (www.abschweb.de/spar/190605.htm),
aber dort ist das hier diskutierte Feature nicht vorgesehen.
Gruß
Manfred
Antwort 7 von Friedel
Natürlich muss die geänderte Hintergrundfarbe mit Hilfe der Hintergrundfarbe des Hintergrund bestimmenden Elternelementes berechnet werden. Wird die jeweile Hintergrundfarbe immer vom Body bestimmt? Oder kann sie auch durch Tabellen oder andere Blockelemente mit farbigem Hintergrund bestimmt werden? Es ist ja kein Problem, die Hintergrundfarbe des Body zu prüfen. Man kann auch für letzten Fall die bestimmende Hintergrundfarbe prüfen, aber es ist ungleich koplizierter. Letzteres geht mit DOM, JavaScript und CSS. Ersteres geht bohne DOM.
Antwort 8 von abschweb
Schön, ich kann eine geeignete Hintergrundfarbe aus der Haupthintergrundfarbe berechnen. Das ist mir klar. Der Wert steht dann als Javascript-Variable zur Verfügung. Wie bringe ich diesen Wert dann ins <span>, ohne dass ich den gesamten <span>-Ausdruck ins Javascript verpacken müsste (document.write ...), das würde mir nicht gefallen.
Gruß
Manfred
Gruß
Manfred
Antwort 9 von rfb
am einfachsten:
diese Funktion färbt nach Aufruf alle spans, die ein title-Attribut haben, in die Farbe "berchneterFarbwert"
function spanfaerben(berechneterFarbwert) {
var a=eval(document.getElementsByTagName("span"));
for (var j=0; j<a.length; j++) {
if (a[j].title!="")
a[j].style.backgroundColor=berechneterFarbwert;
}
}
diese Funktion färbt nach Aufruf alle spans, die ein title-Attribut haben, in die Farbe "berchneterFarbwert"
Antwort 10 von abschweb
@rfb
Danke, die Lösung hat was!
Gruß
Manfred
Danke, die Lösung hat was!
Gruß
Manfred
Antwort 11 von Friedel
Das mit dem title-Attribut ist ne gute Idee. Ich hatte den Gedanken, für die Spans eine Klasse an zu legen, aber das ist durch diese Idee nicht notwendig.
Falls die Spans auch anderen Elementen mit Hintergrundfarbe vorkommen können (Table, Div, weitere Span o.ä.) müsstest du mit Hilfe des Node-Objektes ( http://de.selfhtml.org/javascript/objekte/node.htm) und parentNode (http://de.selfhtml.org/javascript/objekte/node.htm#parent_node) die Elementhirarchie jeweils bis zum Body durchkämmen und jedes Element aauf eine Hintergrundfarbe prüfen. Dann funzt es auch, wennndas bewußte Span in einer Tabelle oder einem Div mit farbigem Hintergrund ist.
Falls die Spans auch anderen Elementen mit Hintergrundfarbe vorkommen können (Table, Div, weitere Span o.ä.) müsstest du mit Hilfe des Node-Objektes ( http://de.selfhtml.org/javascript/objekte/node.htm) und parentNode (http://de.selfhtml.org/javascript/objekte/node.htm#parent_node) die Elementhirarchie jeweils bis zum Body durchkämmen und jedes Element aauf eine Hintergrundfarbe prüfen. Dann funzt es auch, wennndas bewußte Span in einer Tabelle oder einem Div mit farbigem Hintergrund ist.
Antwort 12 von abschweb
ja, Friedel, es kann vorkommen, aber so selten,
dass ich diese Fälle (maximal 2) mit Handarbeit lösen werde.
Es kommen ja auch Hintergrundfotos vor.
Aber 95 % der Fälle wären mit rfbs Lösung wohl abgedeckt!
Gruß
Manfred
dass ich diese Fälle (maximal 2) mit Handarbeit lösen werde.
Es kommen ja auch Hintergrundfotos vor.
Aber 95 % der Fälle wären mit rfbs Lösung wohl abgedeckt!
Gruß
Manfred