- From: Brian Kardell <bkardell@gmail.com>
- Date: Mon, 7 Mar 2011 11:50:35 -0500
- To: www-style@w3.org
- Message-ID: <AANLkTik5rdjp8F6y4vykt1beAVvfQWNGTGk_bxJEpg9J@mail.gmail.com>
I haven't seen any follow up on this discussion of additivity, but I think this is related. I've spent a long time running through the archives and thinking about something related and I have a question. Given the existing way it's spelled out, you can do this with transitions: .x{ transition-property: height, opacity; transition-duration: 2s; } or even: .x{ transition-property: height, opacity; transition-duration: 2s, 2s; } There are pretty good resolution specifications in there that appear to follow other standard approaches in other CSS properties as to what it means when properties are bad or repeated or the number of durations doesn't match, etc... Typically the next matching rule would essentially overwrite the value of that property. However, CSS allows you to do some great things in other areas like use percentages which operate off the calculated value (I think that's the right term)... So here's my question... If it is possible to have such good resolution specifications - and since those properties are kind of 'array-like' (they almost seem like they should be plural), why can CSS not allow something like an additive notation so that given the rules (I am using '+' in the example, but that's just off the top of my head and unimportant to the conversation): /* standard - set the two properties */ .x { transition-property: height; transition-duration: 2s; } /* push one more onto the list of transitioned properties */ .y { transition-property: +opacity; } /* push one more onto the list of transitioned properties and one more onto the list of transitioned durations */ .z{ transition-property: +width; transition-duration: +4s; } <div class="x">Standard</div> <div class="y">Opacity transitions over 0 seconds (initial value)</div> <div class="z">Height transitions over 2 seconds (initial value)</div> <div class="x y"> Height and opacity transition over 2s</div> <div class="x z"> Height transitions over 2s, width transitions over 4s</div> It seems kind of logical to think that if you _can_ express it as a list of values, it shouldn't be hard to 'push' onto the list... The only potential confusion I can think of is in adding to durations which don't match the properties, for example: .x{ transition-property: height, width, left; transition-duration: 2s, 1s; } .y{ transition-property: +opacity, top; transition-duration: +3s; } In the case where something was x and y it would probably be pushing onto the expanded list (2s, 1s, 2s, 1s) to avoid confusion...But that's sort of how most calculations work in CSS I think anyway... Thoughts? Is it clear what I am asking?
Received on Monday, 7 March 2011 16:51:07 UTC