| Hilfreiches Formular |
<html><head>
<style type="text/css">
input {
border: 1px solid black;
background-color: #A5A2A2;
margin: 5px;
padding: 2px 2px 2px 5px;
vertical-align: top;
}
input:focus { background-color: #E3E3E3; }
input:hover { background-color: #E3E3E3; }
</style>
</head>
<body>
<input type="text" name="Name"<br>
Mozilla und neue Opera-Browser kommen damit klar und ändern die Input-Feld-Farbe von dunkelgrau nach hellgau. Der IE 6 hinkt hier hinterher und versteht diese Anweisung nur in Bezug auf Hyperlinks. Ein einfacher Farbwehsel ist aber nichts neues, mit den Style-Anweisungen ließe sich zum Beispiel das aktuelle Eingabefeld oder dessen Schrift vergrößern. So fällt es nicht nur besonders auf, es hilft gerade kurzsichtigen Besuchern gut weiter.
Damit der Internet Explorer also auch bei Klick auf das Feld die Farbe wechselt und der Besucher das aktive Feld deutlich unterscheiden kann, braucht es die Javascript Events onclick und onblur.
<input type="text" name="Name" onclick="this.style.background='#E3E3E3';" onblur="this.style.background='#A5A2A2';"> <br>Der erste ändert die Farbe bei Aktivierung des Feldes in helleres grau, der zweite sorgt dafür dass alles rückgängig gemacht wird, wenn das nächste Feld angeklickt wird. Um auch den Hover-Befehl zu simulieren, lässt sich mit "onmouseover" und "onmouseout" dem Feld eine weitere Farbe zuweisen.
|
Computerbücher sind teuer. Wir testen unsere Buchtipps zuerst
ausführlich, bevor wir sie vorstellen. Unsere Buchempfehlungen zum Thema Webdesign: CSS Praxis Kai Laborenz präsentiert modernen Webdesignern mit dem CSS Praxis Buch ein optimales Naschlagewerk. Wer nämlich immer noch auf Tabellen setzt und Style Sheets aus Kompatibilitätsgründen missachtet, gehört längst zum alten Eisen.
mehr...Perl Cookbook PHP 4.3 MySQL Kochbuch Behandelt MySQL 4.0: So prägnant dieser Zweiwort-Satz ganz oben auf der Titelseite des MySQL Kochbuch klingt, so umfassend ist der Inhalt.
mehr...Alle Buchtipps anzeigen |
||