W3C home > Mailing lists > Public > whatwg@whatwg.org > January 2011

[whatwg] New method for obtaining a CSS property

From: Brett Zamir <brettz9@yahoo.com>
Date: Thu, 27 Jan 2011 14:23:09 +0800
Message-ID: <4D410F4D.9030902@yahoo.com>
On 1/27/2011 11:21 AM, Tab Atkins Jr. wrote:
> On Wed, Jan 26, 2011 at 6:47 PM, Brett Zamir<brettz9 at yahoo.com>  wrote:
>> While it can already be done dynamically by iterating through
>> document.stylesheets, in order to allow full separation of presentation from
>> content in a convenient way and foster best practices, I think it would be
>> helpful to have a built-in method to obtain a CSS property for a given
>> selector.
>>
>> This is particularly needed by canvas which has no inherent way of obtaining
>> styles set in a stylesheet, but would also be useful for HTML and SVG where
>> setting a class dynamically may not always be sufficient, such as in a
>> dynamically powered transition which wants to obtain starting and ending
>> style properties.
>>
>> (This issue might also highlight some gaps in CSS, with, for example, there
>> being no exact equivalent for say shadow color as used in canvas, but even
>> without such changes to CSS, the proposed method would still be useful.)
> What are you actually trying to accomplish?  I can't tell from this
> email what data you're trying to get, precisely, and nowhere do you
> state what problem you're trying to solve.

I'll give a more concrete example, but I did state the problem: 
separation of concerns, and the data I want, getting a CSS property for 
a given selector.

For example, we want the designer guy to be able to freely change the 
colors in the stylesheet for indicating say a successful transition 
(green), an error (red), or waiting (yellow) for an Ajax request. The 
JavaScript girl does not want to have to change her code every time the 
designer has a new whim about making the error color a darker or lighter 
red, and the designer is afraid of getting balled out for altering her 
code improperly. So the JavaScript girl queries the ".error" class for 
the "background-color" property to get whatever the current error color 
is and then indicates to an animation script that "darkred" should be 
the final background color of the button after the transition. The 
retrieval might look something like:

document.getCSSPropertyValue(".error",  "background-color");  // 'darkred'

While the JavaScript would choose the intermediate RGB steps to get 
there in the fashion desired by the developer.

Yes, there are CSS transitions, or maybe SVG, but this is for cases 
where you want control tied to JavaScript.

Or, for canvas specifically. You draw an animated "Hello" and want the 
designer to be able to choose the fill color. You want to be able to 
query the stylesheet easily to get the styling info.

Brett
Received on Wednesday, 26 January 2011 22:23:09 UTC

This archive was generated by hypermail 2.4.0 : Wednesday, 22 January 2020 16:59:30 UTC