onMouseOver funktioniert nicht

[carpet]

Hallo !
Kann jemand mir bitte sagen, warum meine onMouseOver Def. nicht funktioniert ?

...
   <style type="text/css">
   <!--
      input {
         background:blue;
         color:white;
         width:120px;
         cursor:hand;
         onmouseover:color:white;
         onmouseout:color:yellow;
      }
   -->
   </style>

<input type=button value="Suchen">
...

MfG
carpet

[ichen]

Moin!

onmouseover:color:white;
         onmouseout:color:yellow;

soweit ich weiß, existiert in CSS kein onmouseover bzw out. das gehört zu Javascript. versuche es mit:
input:hover { color:; }
das versteht allerdings der  nicht. vielleicht solltest du dir dann mit javascript helfen.
http://de.selfhtml.org/javascript/sprache/eventhandler.htm
da findest du was zui javascript.
tschüss ichen

[Fabian St.]

Hi!

Hallo !
Kann jemand mir bitte sagen, warum meine onMouseOver Def. nicht funktioniert ?

Ja, das kann ich :-)
Der einfache Grund leigt darin, dass CSS nicht die Eigenschaft onmouseover kennt, sondern nur die Pseudoklasse :hover, die der IE jedoch wiederum nur auf Links anwnden kann.
Mit JavaScript dagegen gibt es eine Möglichkeit, die in allen (moderneren) Browsern funktioniert:

<script type="javascript">
function hover()
{
   document.all.input.style.bgcolor = "red"
}

<input type="button" id="button" onmouseover="hover()" />

Grüße,
Fabian St.

[Fabian St.]

Hi!

Sorry ich vergaß, dass abschließende </script>

<script type="javascript">
function hover()
{
   document.all.input.style.bgcolor = "red"
}

</script>

<input type="button" id="button" onmouseover="hover()" />

Grüße,
Fabian St.

[Bubax]

Hi,

Mit JavaScript dagegen gibt es eine Möglichkeit, die in allen (moderneren) Browsern funktioniert:
[...]
document.all.input.style.bgcolor = "red"
[...]

Eine Aussage, die ich bezweifeln möchte. document.all kennt nur der IE und alle, die sich wg. Kundenfreundlichkeit an ihm orientieren (z.B. Opera). Greife stattdessen auf reguläre Methoden des DOM zurück: document.getElementById("myID").

Da stimmt dann auch die Aussage: "Eine Möglichkeit, die in allen (moderneren) Browsern funktioniert" - da NS 4.x dies nicht beherrscht.

Viele Grüße,
Bubax

[Fabian St.]

Hi!

Eine Aussage, die ich bezweifeln möchte. document.all kennt nur der IE und alle, die sich wg. Kundenfreundlichkeit an ihm orientieren (z.B. Opera). Greife stattdessen auf reguläre Methoden des DOM zurück: document.getElementById("myID").

Sorry, dass ich vergessen habe, dass document.all nur vom IE unterstützt wird - dass wollen wir natürlich nicht :-)
In diesem Falle ist deine Lösung wirklich besser.

Grüße,
Fabian St.

[molily]

Hallo,

Mit JavaScript dagegen gibt es eine Möglichkeit, die in allen (moderneren) Browsern funktioniert:
[...]
document.all.input.style.bgcolor = "red"
[...]

Eine Aussage, die ich bezweifeln möchte. document.all kennt nur der IE und alle, die sich wg. Kundenfreundlichkeit an ihm orientieren (z.B. Opera). Greife stattdessen auf reguläre Methoden des DOM zurück: document.getElementById("myID").

Dazu braucht das Element eine ID. Die ist aber, solange sie nicht gerade für ein label-Element gebraucht wird, unnötig. Also zumindest <input ... onmouseover="hover(this)"> und eine generische Funktion, die das Elementknotenobjekt als Parameter entgegennimmt. Darüber hinaus fehlt das Zurücksetzen der Farbe beim onmouseout, also müsste noch onmouseout="hoverout(this)" oder ähnliches her. Wenn auch eine Änderung beim Fokus (onfocus/onblur) gewünscht ist, sollte darüber nachgedacht werden, die Events zentral zu vergeben, falls man den Trend »separation of behaviour and structure« mitmachen will.

Mathias

[Bubax]

Hi,

es gibt kein cursor:hand.
Evtl. suchst Du cursor:pointer. Dies verwende aber stets nur dann, wenn der Besucher tatsächlich auch klicken kann.

Viele Grüße,
Bubax

[molily]

Hallo,

es gibt kein cursor:hand.

Die Realität ist übrigens etwas anderes als das, was in technischen Standards normiert ist. Manche verwechseln gerne Soll und Sein.

Evtl. suchst Du cursor:pointer.

Eventuell sucht er http://www.quirksmode.org/css/cursor.html#pointer, wenn er sich um Gebrauchstauglichkeit Gedanken macht. (Steht auch zur Genüge im Archiv.)

Mathias

[Struppi]

<style type="text/css">
   <!--
      input {
         background:blue;
         color:white;
         width:120px;
         cursor:hand;
         onmouseover:color:white;
         onmouseout:color:yellow;
      }
   -->
   </style>

das ist Fanatsie Syntax (oder aus welcher Dokumentation hast du diese Zeilen entnommen).

Du suchst die CSS-Pseudoklasse :hover
http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#link_visited_hover_active_focus

Struppi.