Re: CSS Selectors: How to style non-styleable?

Le Fri, 10 Mar 2006 21:27:54 +0200, Andrew Fedoniouk  
<news@terrainformatica.com> a écrit:

> There are situations when we need to define styles
> of sub-elements of some DOM element.
> Such sub-elements are not parts of the DOM so exsting selectors
> cannot be applicable to them.
<...>

The follow-up to my incomplete email (sorry!):

1. Provide DOM elements for scrollbars and for all "hidden" elements.

document.getElementById('scrollable-element').scrollbar:

This should be available to any scrollable element (with overflowing  
content), be it body, a div, a textarea or a <select>.

.top()
.bottom()
These scroll to top / bottom.

.maxY
.maxX
Each returns an integer: the maximum scrollable area (X or Y axis).

.goto(x, y)
.gotoX(x), .gotoY(y)
Each scrolls to x and y, where x and y are the pixels.

.upElement
.downElement
.leftElement
.rightElement
.handleXelement
.handleYelement
.backgroundElement

All of these could be DOMScroll defined as ... something along these lines:

.id
.className
.activate() - performs the action (similar to clicking), only for up,  
down, left and right "elements".

Each of them with class names: scrollUp, scrollDown, scrollLeft,  
scrollRight, scrollHandleY, scrollHandleX, scrollBackground.

Scripts should be able to set IDs to any of these elements (authors could  
specifically style a scrollbar element in a way they want).

Almost all normal styling properties can apply to these elements:  
backgrounds, colors, and even positioning - scrollbars could be positioned  
different (it's up to the imagination of the designer).

CSS selectors could "see" the scrollbars of each element... as child  
nodes. For example:

body > div > .scrollUp

Pros: Scrollbars can be dynamically manipulated via DOM (IDs, class names,  
etc).

Cons: looks like a hack.


2. Another proposal is pure CSS:

.scrollable-elements::scrollUp
/* scrollDown/scrollLeft/scrollRight/scrollHandle/scrollBackground */
{
 color: #000;
 background: url("img.png") #FFF;
 ...
}

Again, almost all styling properties could apply. Manipulation via DOM is  
not all lost with this approach (there's DOM 2 Style).

Pros: This is simple and straightforward. I'd go for an improved version  
of this, based on further comments, or even a combination with the method  
described above.

Cons: I don't like the usage of :pseudo-elements thing. Yet, things such  
as :scrollUp fall almost in the same category as :first-line and the rest.  
So, this might not be a problem at all.

Anyone has more ideas?



P.S. Apologies again for the previous incomplete message.

-- 
http://www.robodesign.ro
ROBO Design - We bring you the future

Received on Friday, 10 March 2006 21:16:54 UTC