Re: [gradients] basics

On Mon, Dec 7, 2009 at 12:25 PM, Brad Kemper <brad.kemper@gmail.com> wrote:
> Just to revive this topic a little. I kind of like the idea, actually, but not all the time. For instance, take a look at the following, which used PNGs to simulate what a linear-gradient could do:
>
> http://www.bradclicks.com/cssplay/linear-gradient/chrome.html
>
> The idea is that the top layer of the background is only covering the bottom half of the gradient below it. You can see this in a recent Webkit download, and it works, and I like it. The code is this:

Ah, cool.  The effect was subtle enough that I had to play with the
page before I realized what you were doing, and why it wasn't doable
with the infinite-extend gradient.

All right then, makes sense.


> I was thinking that perhaps to get the "infinite outside" effect you bring up, then maybe there could be a new value, such as 'background-repeat: extend' that would not repeat the image, but would should its outside, clipped only by the background painting area.

So under a standard no-repeat value, the gradient itself would
actually be the size of the background painting area, but with
'extend' it would be infinite in extent and merely clipped to the
background painting area when painting occurs?

This still doesn't seem consistent with how no-repeat works for other
images, though.  A too-large image isn't chopped to fit in the
background area; if you move it around with background-position or
resize it with background-size, you still get the whole thing.

I don't think that adding some special value in background-repeat is
the correct way to address infinite images, for the same reason I
didn't think it was appropriate to have background-repeat affect
whether or not a gradient repeated.  These are things that happen
*after* the image is created, not before/during.

So, essentially, if the background-repeat value affects image
generation, it's sort of nasty imo (leaking of levels, and certain
effects becoming bound to background-* properties that would be useful
in the other places where gradients can be used).  If it affects
things after image generation, then we're bound by legacy constraints
that we should be consistent with, in that no-repeat doesn't clip
anything.

If you want a finite gradient, the best thing to do is to find a way
to chop the image to the size you want.  -moz-image-rect() partially
does this, producing a new image at the dimensions you specify.  If we
pull that into Images and make it a touch more powerful (frex, give it
the ability to use % to refer to the box dimensions?) or produce
something similar that does what we want, it would work better.

~TJ

Received on Tuesday, 8 December 2009 00:26:41 UTC