hover bei hr-tag ?

[braindead]

ich habe da mal eine kleine frage und zwar:
ist es möglich, eine horizontale linie (hr-tag), bei mauszeigerberürung farblich zu verändern, so wie es mit css und dem "hover"-adribut möglich ist textzeilen farblich zu verändern ?

wenn ja, wie ?

[Kai Lahmann]

ich habe da mal eine kleine frage und zwar:
ist es möglich, eine horizontale linie (hr-tag), bei mauszeigerberürung farblich zu verändern, so wie es mit css und dem "hover"-adribut möglich ist textzeilen farblich zu verändern ?

<hr style="background-color:red;" onmouseover="this.style.backgroundcolor='blue'" onmouseout=this.style.backgroundcolor='red'" />

(bin mir jetzt nicht sicher, ob das wirklich background-color ist, aber das prinzip sollte klar sein... sonst versuch auch nochmal color und border-color, evtl. müsses's sogar mehrere für mehrere Browser sein

p.s. das Netscape 4 (nicht 6 !) dafür zu doof ist sollte klar sein.

[Antje Hofmann]

Hallo Kai

<hr style="background-color:red;" onmouseover="this.style.backgroundcolor='blue'" onmouseout=this.style.backgroundcolor='red'" />

(bin mir jetzt nicht sicher, ob das wirklich background-color ist, aber das prinzip sollte klar sein... sonst versuch auch nochmal color und border-color, evtl. müsses's sogar mehrere für mehrere Browser sein

wenn du antwortest dann bitte richtig und wenns geht auch geprüft. Es ist nicht zuviel verlangt bei solchen einfachen Einzeiler eine Überprüfung vorzunehmen. Ist übrigens schneller als das was du deswegen dazu schreibst.

Hier die korrigierte Lösung:

Variante 1
<hr color="red" onmouseover="this.color='blue'" onmouseout="this.color='red'" />

Variante 2
 <hr style="color:red;" onmouseover="this.style.color='blue'" onmouseout="this.style.color='red'" />

Viele Grüße

Antje

PS: Macht es dir eigentlich Spaß bereits beantwortete Fragen nochmal zu beantworten? Mir ist das mehrfach aufgefallen.

[braindead]

zenk ju
das ging ja flux.
ich werd das jetzt mal aus-checken :)

[Kai Lahmann]

wenn du antwortest dann bitte richtig und wenns geht auch geprüft. Es ist nicht zuviel verlangt bei solchen einfachen Einzeiler eine Überprüfung vorzunehmen. Ist übrigens schneller als das was du deswegen dazu schreibst.

Da ich keinen IE besitze kann ich es in dem schonmal nicht profen. Und wie da schon steht, bin ich der Meinung, dass das in einzeilenn Browsern anders ist.

Variante 2
<hr style="color:red;" onmouseover="this.style.color='blue'" onmouseout="this.style.color='red'" />

und genau das tut in Mozilla gar nichts. boackground-color bzw. im Script backgroundColor wirkt aber. konqueror hat wieder was anderes: hier isses border-color bzw. borderColor... hat noch einer was für Opera?
Standards huhu, wo seit ihr?

PS: Macht es dir eigentlich Spaß bereits beantwortete Fragen nochmal zu beantworten? Mir ist das mehrfach aufgefallen.

teilweise bin ich wohl einfach zu langsam...:)

[Antje Hofmann]

Hallo Kai,

Da ich keinen IE besitze kann ich es in dem schonmal nicht profen. Und wie da schon steht, bin ich der Meinung, dass das in einzeilenn Browsern anders ist.

Ich bezog mich vorallem auf die enthaltenden JavaScriptfehler. Wie soll ein Anfaenger rausfinden, dass Anführungsstriche vergessen wurden und Color großgeschrieben wird?

<hr style="color:red;" onmouseover="this.style.color='blue'" onmouseout="this.style.color='red'" />
und genau das tut in Mozilla gar nichts. boackground-color bzw. im Script backgroundColor wirkt aber. konqueror hat wieder was anderes: hier isses border-color bzw. borderColor... hat noch einer was für Opera?

Opera ändert sowieso nicht die Farbe. Ich habe mal ein wenig experimentiert. Das interpretiert Netscape 6 und IE.

<hr size="4" style="color:red;background-Color:red;border:none" onmouseover="this.style.color='blue';this.style.backgroundColor='blue'" onmouseout="this.style.color='red';this.style.backgroundColor='red'" />

zu den Standards, ich glaube die sind Schuld an diesem Verhalten. Farben für Linien gibts nicht in HTML 4.01
Damit bleibt es jedem Hersteller selber überlassen, wie er das Element behandelt. Vielleicht steckt irgendwas in den Tiefen der CSS-Spezifikationen.
Füge doch einfach mal die Variante für konqueror hinzu (bitte getestet) und dann haben wir eine Lösung, auf die man später verweisen kann.

Viele Grüße

Antje

[Kai Lahmann]

machen wir es kurz:

<hr style="color:red;border-color:red;background-color:red;" onmouseover="this.style.color='blue';this.style.backgroundColor='blue';this.style.borderColor='blue';" onmouseout="this.style.color='red';this.style.backgroundColor='red';this.style.borderColor='red';" />

so, das sieht zwar abenteuerlich aus, aber hat zur Folge..:

script-error in Netscape 4 *g*
in IE, Mozilla und konqueror wird die normal rote linie beim rüberfahren mit der Maus blau.
in Opera 5 passiert gar nichts.
Opera 6 ?

[kerki]

Hallo !

<hr style="color:red;border-color:red;background-color:red;" onmouseover="this.style.color='blue';this.style.backgroundColor='blue';this.style.borderColor='blue';" onmouseout="this.style.color='red';this.style.backgroundColor='red';this.style.borderColor='red';" />

WIN 98SE : NS 4.72  : keine Fehlermeldung,
                      hr in Standard-Farbe,
                      kein Hover-Effekt

Opera 6b : hr in rot,
                      kein Hover-Effekt

IE6      : tadellos

Mozilla  : tadellos
            0.9.5

Könnte schlimmer sein. :-)

Gruß,

kerki

[Kai Lahmann]

Opera 6b : hr in rot,
                      kein Hover-Effekt

naja, schon mal ein Fortschritt... Hoffen wir mal, das das nicht die einzige Neuerung im 6er ist :)

IE6      : tadellos

Mozilla  : tadellos
            0.9.5

warum auch nicht? :)

Könnte schlimmer sein. :-)

stimmt.

[Thomas Meinike]

script-error in Netscape 4 *g*

Deshalb wird auch abgefragt:
onwhateveryouwant="if(this.style)this.style.property='value' ..."

in Opera 5 passiert gar nichts.

Opera 5.x kennt kein dynamisches backgroundColor.

Opera 6 ?

Habe ich noch nicht getestet.

MfG, Thomas

[Kai Lahmann]

Deshalb wird auch abgefragt:
onwhateveryouwant="if(this.style)this.style.property='value' ..."

was 'nen denkfehler von mir. Da kommt kein error, weil Netscape 4 ein onmouseover-Attribut eh nicht kennt.

Opera 5.x kennt kein dynamisches backgroundColor.

und generell nichts um <hr />s zu färben.

[Thomas Meinike]

Deshalb wird auch abgefragt:
onwhateveryouwant="if(this.style)this.style.property='value' ..."
was 'nen denkfehler von mir. Da kommt kein error, weil Netscape 4 ein onmouseover-Attribut eh nicht kennt.

Es koennten aber auch andere Browser so reagieren. Das this-Kontextobjekt ist eben nicht ueberall vorhanden, deshalb ist diese Abfrage sinnvoll.

MfG, Thomas

[Antje Hofmann]

Hallo Thomas

onwhateveryouwant="if(this.style)this.style.property='value' ..."
was 'nen denkfehler von mir. Da kommt kein error, weil Netscape 4 ein onmouseover-Attribut eh nicht kennt.

Es koennten aber auch andere Browser so reagieren. Das this-Kontextobjekt ist eben nicht ueberall vorhanden, deshalb ist diese Abfrage sinnvoll.

In diesem Fall sorgt aber auch dein Aufruf für einen Fehler. Wenn der Browser this als Objekt nicht kennt, dann sollte er bei der Abfrage sowieso einen Fehler werfen, denn mit this.style greifst du ja auf eine Eigenschaft des Objektes this zu.

Aber ich glaube kaum, dass ein Browser der JavaScript kennt, den this-Syntax nicht kennt, denn er war von Anfang an mit dabei. Genausogut kann man davon ausgehen, dass ein Browser, der HTML-Objekte weitgehend nach DOM interpretiert auch das Styleobjekt kennt.
Deshalb ist es im Beispiel des HR-Elementes eigentlich nicht zwingend notwendig danach zufragen. In allen anderen Fällen -wie z.B. beim a-Element ist es jedoch schon erforderlich mit if (this.style) eventuelle Fehler abzufangen.

Viele Grüße

Antje

[Thomas Meinike]

In diesem Fall sorgt aber auch dein Aufruf für einen Fehler. Wenn der Browser this als Objekt nicht kennt, dann sollte er bei der Abfrage sowieso einen Fehler werfen, denn mit this.style greifst du ja auf eine Eigenschaft des Objektes this zu.

Nein, es wird bei dieser if-Abfrage ggf. false zurueck gegeben, was Du im NN 4.x sofort ausprobieren kannst.

MfG, Thomas

[Thomas Meinike]

In diesem Fall sorgt aber auch dein Aufruf für einen Fehler. Wenn der Browser this als Objekt nicht kennt, dann sollte er bei der Abfrage sowieso einen Fehler werfen, denn mit this.style greifst du ja auf eine Eigenschaft des Objektes this zu.

Nachtrag: Korrekt ist natuerlich, dass geprueft wird, ob style im Kontext verfuegbar ist und nicht auf this an sich.

MfG, Thomas

[Kai Lahmann]

Es koennten aber auch andere Browser so reagieren. Das this-Kontextobjekt ist eben nicht ueberall vorhanden, deshalb ist diese Abfrage sinnvoll.

also zum einen gibt es keinen Browser, der diese Events kennt, aber kein this.style (oder IE4..?).. oder würdest du auch ein if(document.images) immer einbauen..?
Zum anderen wird wohl wer sol einen Browser nunt eh entweder verzweifelt flüchten, oder JS-Errors abschalten :)

[Antje Hofmann]

Hi Kai

<hr style="color:red;border-color:red;background-color:red;" onmouseover="this.style.color='blue';this.style.backgroundColor='blue';this.style.borderColor='blue';" onmouseout="this.style.color='red';this.style.backgroundColor='red';this.style.borderColor='red';" />

so, das sieht zwar abenteuerlich aus, aber hat zur Folge..:

script-error in Netscape 4 *g*

sieht doch gut aus, nur eine Frage habe ich. Was für eine seltsame Netscapeversion hast du denn?
Netscape 4 kennt die Eventhandler onmouseover/out doch gar nicht für das hr-Element?

Laut Doku:

Executes JavaScript code when a MouseOver event occurs; that is, once each time the mouse pointer moves over an object or
area from outside that object or area.
 Event handler for Layer, Link

Er dürfte demnach Scriptfehler nur dann anzeigen, wenn ein Syntaxfehler vorhanden ist. Hier müßten aber alle Browser meckern.

Welchen Fehler zeigt er an und wie heißt die Browserversion?

Viele Grüße

Antje

[Kai Lahmann]

script-error in Netscape 4 *g*

sieht doch gut aus, nur eine Frage habe ich. Was für eine seltsame Netscapeversion hast du denn?
Netscape 4 kennt die Eventhandler onmouseover/out doch gar nicht für das hr-Element?

äääh.. ups :) hatte da jetzt so nicht dran gedacht.. wenn 'nen Netscape 4 diesen Script-Teil zu "futtern" bekommt, gibt's 'nen Error. Also z.B. wenn man das in einen <a onclick=""> macht.

[Antje Hofmann]

Hi Kai

script-error in Netscape 4 *g*

sieht doch gut aus, nur eine Frage habe ich. Was für eine seltsame Netscapeversion hast du denn?
Netscape 4 kennt die Eventhandler onmouseover/out doch gar nicht für das hr-Element?
äääh.. ups :) hatte da jetzt so nicht dran gedacht.. wenn 'nen Netscape 4 diesen Script-Teil zu "futtern" bekommt, gibt's 'nen Error. Also z.B. wenn man das in einen <a onclick=""> macht.

Da bin ich aber beruhigt, denn es wäre echt fatal, wenn man sich nicht mal auf das dokumentierte Nichtkönnen des Browsers verlassen kann.

Viele Grüße

Antje

[orlando magic]

Hi, Antje & Kai

<hr style="color:red;border-color:red;background-color:red;" onmouseover="this.style.color='blue';this.style.backgroundColor='blue';this.style.borderColor='blue';" onmouseout="this.style.color='red';this.style.backgroundColor='red';this.style.borderColor='red';" />

so, das sieht zwar abenteuerlich aus, aber hat zur Folge..:

script-error in Netscape 4 *g*
in IE, Mozilla und konqueror wird die normal rote linie beim rüberfahren mit der Maus blau.
in Opera 5 passiert gar nichts.
Opera 6 ?

Opera 6 (Build 999, Win98SE) interessiert's ebenfalls (noch) nicht.

LG Orlando