Ich vermute, daß sich der Behavior-Hack csshover2.htc nicht auf die Pseudoklasse :focus anwenden lässt.

Wenn du, entgegen deinem ursprünglichen Vorhaben, nun doch Javascript einsetzen willst, dann probier mal folgendes (ohne Behavior-Hack):

CSS-Code

Code :

1 2 3 4 5 6 7 8 9 10

.bgChanging {     color:#000;     background:#fff;     border:1px #363 solid; } .bgChanging:focus, .focus { /* Klasse .focus für IE */     color:#000;     background:#cfc;     border:1px #363 solid; }

HTML-Code:

<input type="text" name="title" class="bgChanging" onfocus="this.className='focus'" onblur="this.className='bgChanging'"/>

Ich hab den Algorithmus noch etwas verbessert, nun sollte er funktionieren:

Code :

1 2 3 4 5 6 7 8 9 10 11 12

window.onload=function() {     var inputElements = document.getElementsByTagName("input");     for(var i=0; i<inputElements.length; i++) {         var inputType = inputElements[i].type;         if( inputType.toLowerCase() != "text" && inputType.toLowerCase() != "password" ) {             continue;         }         inputElements[i].className += " default";         inputElements[i].onfocus = new Function("this.className += ' valid'");         inputElements[i].onblur  = new Function("if(this.value == this.defaultValue || this.value == '') this.className = this.className.replace(/(\\s*\\bvalid\\b)+/, '')");     } }

Als Klassen wären da „default“ und „valid“.

Ich vermute, daß sich der Behavior-Hack csshover2.htc nicht auf die Pseudoklasse :focus anwenden lässt.

Dieses Feature sollte die Version 2 "eigentlich" erhalten haben.

Hab mal die vermeintliche Feature-Liste kopiert:

Fixed :active, it actually didn't work.
Added :focus in a separate 2.01 version. No other differences from 1.41.
Added an onunload handler to clean up the created events, this fixes an increase in both parsetime and memory use per reload.
Added a check to prevent the script from working in IE7 (including any alphas and betas), since :hover will work natively.
Both 1.41 and 2.01 are now licensed under LGPL. Yes, this allows free commercial use.
Various other minor tweaks.

Wenn du, entgegen deinem ursprünglichen Vorhaben, nun doch Javascript einsetzen willst, dann probier mal folgendes (ohne Behavior-Hack):

Ich möchte eigentlich immer noch kein JS einsetzen, aber wie du weiter oben bereits erwähnt hast, scheint die Syntax von JS und den *.htc Files sehr ähnlich aufgebaut zu sein. Sprich, wenn ich die Problemlösung in JS im Syntax verstanden hab, kann ich evtl. das Wissen auf das htc-File umwälzen.

Hab nun ein wenig weitergeforscht.

Der csshover2.htc - Hack scheint wohl ein kleines Problem mit dem IE zu haben. Wenn der IE eine Pseudo-Verhalten wie textarea:focus nicht versteht - verändert er dies und gibt es als textarea:unknown zurück.

Ein Problem taucht nur auf, wenn er von mehrere Pseudo-Klassen textarea:focus und textarea:active ausgeht und beiden ein textarea:unknown zuordnet, kann man natürlich nicht mehr auf die Ursprungselemente zurückschließen.

Aber wenn man sich mit dem textarea:focus -> textarea:unknown zufrieden gibt, ist eine
direkte Zuordnung gegeben.
-->> In dem htc-File müsste nur(?) eine Zuordnung des :unknown zu dem jeweiligen Focus-Effekt geben. Leider versteh ich die Syntax des htc nicht, daher auch der Wunsch das JS zu verstehen

Versteht jemand das htc-File und kann diese Idee im htc umsetzen? Oder lieg ich mit der Lösungsidee voll daneben?

Wozu unbedingt eine HTC-Lösung?

Wozu unbedingt eine HTC-Lösung?

Ich bin bisher auf keine andere lösungsträchtige Alternative gestoßen (kein JS!). Wenn du eine Möglichkeit kennst, wäre ich darüber mehr als erfreut

Das Grundproblem: (siehe 1 Post)

3 Zustände:
1) Hintergrundbild des Inputs vorhanden
2) User "aktiviert" das Feld (durch "keypress", a:active oder was auch immer) -> Hintergrundbild verschwindet bzw. wird weiss (gesamte Fläche)
3) Wenn der User etwas eingegeben hat bleibt die Hintergrundgrafik auf weiss
-> wenn er nichts eingegeben hat (und das Feld wieder verlässt)ändert sich die Grafik wieder auf den im Pkt. 1) genannten Hintergrund

Alternativ kann Pkt 3) auch auf dem weissen Hintergrund von Pkt 2 bleiben (was die Sache wohl deutlich vereinfacht bzw. überhaupt mit CSS realisierbar macht )

Wäre es nicht genial mit einem Hack (htc oder direkt etwas für CSS) den IE zu "zwingen" allen Elementen eine Hover-Verhalten (hover, active, focus und co) zu geben. Dann gehört das lästige JS in diesem Bereich (onfocus=".." und onblur=".." und co) der Vergangenheit an.
Man sollte doch immer offen für die oft zitierte Accessibility sein. Noch ein Link zum aktuellen "Stand" http://www.w3.org/WAI/ .

~~~
-> Zurück zum aktuellen Stand der Problemlösung:

Aber wenn man sich mit dem textarea:focus -> textarea:unknown zufrieden gibt, ist eine
direkte Zuordnung gegeben.
-->> In dem htc-File müsste nur(?) eine Zuordnung des :unknown zu dem jeweiligen Focus-Effekt geben. Leider versteh ich die Syntax des htc nicht, daher auch der Wunsch das JS zu verstehen

Versteht jemand das htc-File und kann diese Idee im htc umsetzen? Oder lieg ich mit der Lösungsidee voll daneben?

Grüsse,
Rexo

Hi Maik,

werd deine Idee mit dem JS nun doch aufgreifen (müssen). Es gibt scheinbar aktuell keine bessere Lösung.

Nun brauch ich noch eine kleine Erweiterung deines JS-Skripts.
Ich möchte, dass ein Hintergrundbild sich schon beim Laden der Seite einstellt.
Das Problem betrifft ja nur den IE:

2 Szenarien:
a) JS aktiviert (-> Hintergrundbild A wird gesetzt und lässt sich bei onfocus auf Hintergrundbild B setzen bzw. bei onblur wieder auf Hintergrundbild A)
b) JS deaktiviert (-> Hintergrund C wird über CSS deklariert)
-> zwar wird im Szenario a) auch das Hintergrundbild C mit CSS deklariert aber vom Hintergrunbild A (ausgelöst von JS) überschrieben.

Da ich wie weiter oben bereits geschrieben von JS leider sehr wenig Ahnung (naja eigentlich gar keine hab), wär es sehr genial, wenn du mir mir "kurz" eine kleine Funktion schreiben kannst, die ich direkt im
<body onload="hintergrundwechsel()">
einsetzen kann und die als Funktion der Klasse .bgChanging das Hintergrundbild A zuordnet.

Danke im vorraus,

Grüsse,
Rexo

Ich vermute, daß sich der Behavior-Hack csshover2.htc nicht auf die Pseudoklasse :focus anwenden lässt.

Wenn du, entgegen deinem ursprünglichen Vorhaben, nun doch Javascript einsetzen willst, dann probier mal folgendes (ohne Behavior-Hack):

CSS-Code

Code :

1 2 3 4 5 6 7 8 9 10

.bgChanging {     color:#000;     background:#fff;     border:1px #363 solid; } .bgChanging:focus, .focus { /* Klasse .focus für IE */     color:#000;     background:#cfc;     border:1px #363 solid; }

HTML-Code:

Code :

1	<input type="text" name="title" class="bgChanging" onfocus="this.className='focus'" onblur="this.className='bgChanging'"/>

// edit

Hi Maik,

hab es bereits selbst gelöst

Naja das Thema ist zwar nicht erledigt. Das Problem aber gelöst.

Werd es dennoch als abgeschlossen markieren. Es wird zwar nie wieder aufgerufen, aber da der IE7 eh in nem starken halben Jahr den Markt "erobert" hat, interessiert auch niemand mehr so ein htc. Hack.

Vielen Dank für éure Hilfe.

Grüsse,
Rexo