RE: background-transform (Was: Re: [css3-images] Repeating oblique gradients)

Where else would you not be able to use this simplification?
For background images, we need extra support in the form of 'background-transform'. For regular images, the support is already there in the form of 'transform'.

In one of your previous emails you mentioned that it's needed for filters. What filter would take a gradient image? Usually filters apply to the shape of their content (ie gradient glow where a simple gradient image won't do)

Rik

-----Original Message-----
From: Tab Atkins Jr. [mailto:jackalmage@gmail.com] 
Sent: Thursday, December 02, 2010 10:02 AM
To: Simon Fraser
Cc: Rik Cabanier; Leif Arne Storset; Brad Kemper; www-style list
Subject: Re: background-transform (Was: Re: [css3-images] Repeating oblique gradients)

On Thu, Dec 2, 2010 at 8:52 AM, Simon Fraser <smfr@me.com> wrote:
> On Dec 1, 2010, at 10:49 pm, Rik Cabanier wrote:
>> So, if the browser vendors are OK with the background-transform, I think the spec could boil down to:
>> axial-gradient(<color-stop>, ...)
>> radial-gradient(<focal-position>, ...) focal point can be dropped if it's considered too advanced.
>>
>> rotation and placement would be done through the background parameters.
>> background-size       defines the pre-transformed size of the 
>> gradient (default=bounding box) background-transform  transforms the 
>> upper left corner of the gradient image background-origin     defines 
>> the point where scaling/skewing/rotation happens background-repeat     signals how the gradient is tiled. Gradients would differentiate themselves from images in that they 'extend' themselves to fill the bounds if there is no repeat.
>
> I'm not sure that I'm OK with background-transform yet, but I think we need to discuss it independently from gradients.
>
> To clarify, I assume that background-transform accepts all the transform functions listed in the 2D transforms spec, but not those in 3D transforms. I further assume that the property is animatable, just like "transform:". This certainly opens up the possibility of lots of neat animation effects, which I like.
>
> I also assume that background-transform applies to each background-image separately, if there are multiple, e.g.:
>
> background-image: url(foo.png), url(bar.png);
> background-transform: skewX(20deg), scale(0.5, 2);
> background-repeat: repeat;
>
> This seems reasonable.

I kinda like background-transform too.

Note, though, that this does not allow us to simplify gradients, for the reasons I stated in the previous thread.  Gradients are useful outside of backgrounds, and there are certain controls that remain useful in these other contexts, so they should be packaged in with gradients.

~TJ

Received on Monday, 6 December 2010 00:54:43 UTC