Re: CSS-Tranformation mechanism and modularizing CSS

Chris Wilson wrote:
> If all you want to do is control event handlers like mouse overs, then use
> the Behavioural Extensions to CSS

No, i'd like to have some general solution to this problem.
The properties defined in BECSS are just some specific HTML
attributes. So that part of BECSS is just a specific solution
to a more general problem. F.e. I'd like to set the alt
attribute of images with CSS, because it has such a nice
counting mechanism.

You can see it as this: if one can set the content of an
element, one should also be able to set the attributes of
an element.

Let me give some examples of a way of setting attributes:

IMG[descr]

    /* This rule sets the alt attribute the value of
       the descr attribute and adds a counter. */
    @attributes {
        alt: "Picture " counter(picture) ": " attr(descr);
    }
    counter-increment: picture;
}

IMG[src2] {
    /* This rule switches the image between scr and scr2 */
    @attributes {
        onmouseover: "this.src1=this.src;this.src=this.src2;";
        onmouseout: "this.src=this.src1;";
    }
}

IMG[scr2]:hover {
    /* This is a shorter version of the previous rule */
    @attributes {
        src: attr(src2);
    }
}

For XML, namespaces might be needed before the attributes.

If an attribute is referenced (through attr()) that is also set
in @attributes, the value depends on the order they appear.
The value of attr() before @attributes is the old one, and after
@attributes it is the newly set value. (So @attributes can appear
more than once inside a block)

For the "style" purists this is probably even worse than BECSS,
but it is at least a general solution.

There are probably some problems (Ian?), but minor, because it
works the same as the content property.

Another way could be:

A {attributes: onmouseover="mOver(this)", onmouseout="mOut(this)";}

But this leads to a very long and ugly property value.

Sjoerd Visscher

Received on Saturday, 2 October 1999 11:37:12 UTC