RE: Collapsing elements

Andrew Fedoniouk wrote:

> > <li><a>(-)`Metals</a><ul>
> >                <li><a>(-) Alkaline Metals</a><ul>
> >                                <li>Lithium</li>
> >                                <li>Sodium</li>
> >                                <li>Potassium</li></ul></li>
> >                <li><a>(+) Transition Metals</a></li>
> > </ul>
> >
> >   
> Alan, about those [+] and [-] signs...
> 
> I do have such thing as foreground-image[1] with the bunch of other 
> foreground-*** attributes
> that mimic exactly correspondent background-image related attributes.
> These [+] and [-] are defined as such foreground image for the <options> 
> element.


The [+] and [-] were only put there as a reference of you image. Users coming across such a page would presume that it would operate like an OS explorer, like "Window Explorer." The images may just there in your example for mimic something like "Window Explorer" but they can actually be real anchor elements.

Try this test. I have give several extra pages to test with since I don't have any :non-visited pseudo elements included in the CSS for my test to work that way. Yes the cache must been cleared to begin again. There are two way to test (only in Firefox).

1. Click on the minus to expand each branch of the tree.
2. Tab to navigate to a minus and select ENTER on the keyboard to expand each branch of the tree.

http://css-class.com/test/css/selectors/pseudo/tree-branch1.htm




> In my case markup I have looks like:
> 
> <options>
>       <caption>Alkaline Metals<caption>
>       <option>Lithium</option>
>       <option>Sodium</option>
>       <option>Potassium</option>
> </options>


The structure is more suited for a definition list which can be nested.

<dl>
	<dt>Alkaline Metals<dt>
	<dl>Lithium</dl>
	<dl>Sodium</dl>
	<dl>Potassium</dl>
</dl>


> is treated specially in the engine - such an image is considered as an 
> "icon" of the element.
> All mouse events have special flag: MouseEvent.isOnIcon.
> This flag allows to handle events on icon specifically - change cursor and
> handle "click-on-icon" cases.
> --
> Andrew Fedoniouk.
> 
> http://terrainformatica.com

Ok, I do want to learn more javascript but I am also seeing this proposal as a thing that can be handled with CSS. I have done thing with CSS that the best of javascript struggles to do. I am also keeping accessibility in mind.


> I think that it really makes sense to add set of typical "behaviors" to CSS.


Yes but we must all cosinder how this is all going to work with pseudo classes

:link, :visited, :hover, :focus, :active


and pseudo elements

:hover, :focus, :active


could we have also have for pseudo elements

:non-focus, :non-active

 
More coming in my reply to Bert Bos


Alan

http://css-class.com/

Received on Friday, 22 February 2008 06:32:52 UTC