Re: [css3-images] gradients keywords and logical (Re: [CSSWG] Minutes and Resolutions Telecon 2011-08-10)

On 16/08/2011 11:51 AM, Brian Manthos wrote:
> Alan Gresley:
>> The code simulates the newer "magic corners" gradient.
>>
>> The issue I have is when these are transitioned or animated. If
>> the transitioned is from 'to bottom right' (as in the code) to 'to
>> bottom', the length between the endpoints (red and blue) go from
>> roughly 200px to 400px. Also instead of the rectangle being
>> circumscribed by the gradient path (or direction) it is inscribed
>> by the gradient path. I would like the ability to control if a
>> gradient path is circumscribing or inscribing a box in a transition
>> or animation.
>
> An example (maybe just a revisit of a previous one) would help me
> (and maybe others) understand the use case.


I have now uploaded an example to simulate the newer "magic corners".

http://css-class.com/test/css/3/gradients/corners-circumscribed.htm


> The example I have in mind is something where you show 2 rows of 5
> boxes.  The first row contains the transition you expect with current
> spec.  The second row contains the transition you would like.  The
> 1st - 5th columns are { start, 25%, 50%, 75%, end }.  Maybe fill the
> boxes using SVG background-image?


This is a simulated transition from corner to side.

http://css-class.com/test/css/3/gradients/corners-circumscribed2.htm


I could not change the values of the gradients since they are not 
transitional as yet so the red and blue extreme points are slightly 
outside the rectangle.

I don't mine this sort of transition but I would also like to be able to 
do a transition where the gradient path is always circumscribing a box 
and the distance between the red and blue extremes of the gradient 
remains constant. This can only happen if the initial newer "magic 
corners" gradient can also extends to the edge of the circumscribing 
circle. Here is a example.

http://css-class.com/test/css/3/gradients/corners-circumscribed3.htm


For this to happen, there needs to be a new keyword for circumscribed 
gradients (that if the current behavior remains the default behavior). I 
happy for this to appear in css4-images. The reason why I believe that 
such gradient should be allowed is that you can use linear and radial 
gradient together and currently radial gradients only circumscribe a box.



-- 
Alan Gresley
http://css-3d.org/
http://css-class.com/

Received on Tuesday, 16 August 2011 05:29:21 UTC