Creating CSS Psuedoclasses?

[MattEvans]

Can it be done? I'm thinking along the lines of :hover.. :visited etc; Could I register my own psuedoclasses? ;) X.Y:Z would be handy for situations where X.Y isn't definitive enough, and X.Y#Z wont work because there's more than 1 Z-type thing on a page.

Using Javascipt to bind objects is acceptable, but how could it be/can it be done? O_o

[tgreer]

I don't understand the question. Creating new CSS definitions would require that 1) you become a member of the appropriate W3C working committee, 2) fully develop the specification, 3) work with browser vendors to support the specification, etc.

[MattEvans]

yeah, but there must be an invokation path that causes an object to be in the state :hover/:visited.. at some point that must enter the level of my page in order for the object on my page to enter that state. i don't want a new draft specification.. i want to map object X to a compound class rather than a 1-tier class.

lets say I have a class called display_area on a div type object:

div.display_area{
background-color:blue;
}

and i want some variance in my display areas, I.E one displays HTML code and one displays PHP code:

div.display_area:HTML{
color:red;
}
 
div.display_area:PHP{
color:yellow;
}

of course, I could do

div.display_area_PHP,div.display_area_HTML{
background-color:blue;
}

and then the relevant specific definitions.

However, I don't neccessarily know whether the displayed code will be PHP or HTML... the object is generated from code. it could be:

div.display_area_Perl, or div.display_area_VB

There's no inheritance of the div.display_area_XXX properties. At the moment, I just nest my divs, but it'd be nice if it were possible to hijack those psuedoclasses...

[MattEvans]

ok, that was a lame example. here's a better one. i have some javascript-controlled buttons in some places, their class is usually button_unpressed. when the mouse is down upon them, the javascript changes the class to button_pressed.

this is fine, but if i want several styles of button, (button_small,button_confirm,button_whatever) they either have to pass a half of their class to the script, or they'll all end up button_unpressed eventually. again, the solution is nesting them in a div and using some inheritance... but. psuedoclasses would look neater in the CSS:

button_small:unpressed, button_small:pressed

and in the markup.

i must admit, i don't know the half of CSS; but it seems like a simple thing, that would result in simpler markup/definitions all round. if it's impossible without rewriting browsers, i'll be astounded, and i'll eat my hat, and yours tgreer. =P

[tgreer]

I won't say it's impossible. But I've never seen it done, and haven't seen any examples, ever. The "hooks" to create and render CSS classes simply don't exist in the DOM. There is nothing to script.

Consider how DOCTYPES, Schemas, and DTDs work: they fully define the underlying DOM. You're trying to add something to the DOM. You'll immediately run into validation errors. The browser looks at the schema to understand how it should respond to certain events, classes, elements, etc. Say you manage to somehow, insert a new "thing" to the schema. What code in the browser is going to process it?

Very, very improbable.

[MattEvans]

hmm, it is seeming difficult: a comparison of two hyperlinks one visited and one not visited shows differences in nothing except ID and content... checking in firefox shows some of the objects attributes are security restricted. checking in IE loops indefinately as the "frames" attribute seems to always have more "frames" inside.

on another note, i never realised you could do this:

div.one{
  background-color:blue;
}
div.two{
  color:red;
}

<div class="one two">I have 2 classes!</div>

it's cool, but not cool enough.

methinks CSS2 isn't worth the hype, unless they've come up with a better way of selecting things than by a number of unrelated classes, or class(es) plus a unique ID.

for my button :active could work, I haven't tested.

methinks I may have some hat-eating to do.