CSS / OnFocus / OnBlur Question

Hello,

I have created a form and assigned each of the form elements to a
class in a style sheet.

I would like to know if it is possible to add 'OnFocus' and 'OnBlur'
events to the style sheet class so that I can change the background
color of a form element WITHOUT having to add 'OnFocus' and 'OnBlur'
events to each individual form element..

If this is not doable, please let me know.. If it is, please let me
know that too! And of course, how to do it.

Thanks

Rich

rwmorey (AT) 27east (DOT) com (Rich Morey) wrote:

I would like to know if it is possible to add 'OnFocus' and 'OnBlur'
events to the style sheet class so that I can change the background
color of a form element WITHOUT having to add 'OnFocus' and 'OnBlur'
events to each individual form element..

Event handler attributes such as OnFocus and OnBlur are completely
external to CSS. They are HTML attributes, which are used to create a
potential association with some program code in some scripting
language. There's no CSS involved - except in the remote sense that the
scripting code may, perhaps, operate on things that correspond, via the
Document Object Model, some CSS properties.

However, there _is_ something ín CSS that corresponds to OnFocus and
OnBlur in some sense, namely the :focus pseudo-class. But note that
:focus is not supported by IE.

When an element is focused on (and it is browser-dependent what this
really means), then, by CSS specifications, it enters the :focus
pseudo-class. And it leaves that pseudo-class when it loses focus.
Thus, you can create nice effects, on supporting browsers, using fairly
simple CSS constructs like

input:focus { background: #ffd; color: black; }

--
Yucca, http://www.cs.tut.fi/~jkorpela/