W3C home > Mailing lists > Public > www-style@w3.org > September 2009

Re: radial-gradient() proposal

From: Tab Atkins Jr. <jackalmage@gmail.com>
Date: Sun, 6 Sep 2009 21:12:35 -0500
Message-ID: <dd0fbad0909061912q255b0056n9dd09557e3460e3d@mail.gmail.com>
To: David Perrell <davidp@hpaa.com>
Cc: www-style list <www-style@w3.org>
On Sun, Sep 6, 2009 at 8:22 PM, David Perrell<davidp@hpaa.com> wrote:
> The ellipses don't measure anything, they are based on the criterion you've specified. Closest-side and farthest-side refer to *one* side except when two sides match that criterion. When they match, the direction of the gradient-line makes no difference because the ellipse is a circle.

Ah, I think you're somewhat confused here then.  The -side values,
when used with an ellipse, refer to *two* sides - the closest
horizontal *and* the closest vertical.  After all, you can't specify
an ellipse with only one axis - you need some way to determine the
second axis.

You may still be thinking that ellipses automatically match the box's
ratio.  That's no longer true (except by accident).

> | Similarly, for an ellipse the to-a-corner distance is, I think, rarely
> | going to be a better choice than the major or minor axis.  Again, you
> | can't reliably tell which is better automatically; this depends on
> | your layout needs.
>
> Consider your needs when you specify a 'cover' ellipse. Will <length> measurements be useful near the outside edge when you don't know the actual dimensions of the box? If so, wouldn't the longest visible distance be a better length reference?

If you don't know the actual dimensions of the box, <length>s aren't
very helpful anyway.  I recommend sticking with percentages in that
case.

> | For circles, of course, these questions are all moot.  They align to a
> | single side, and have only a single radius no matter what direction
> | you're looking in.
>
> Yes, of course. And if you're looking for analogues, consider that the analogue for a radial-gradient confined to horizontal and vertical axes is a linear-gradient confined to horizontal and vertical directions. A linear gradient is just a bisected radial gradient with an infinite radius. If you are precluding angular axes, you have no direct analogue for <angle>.

It's not meant to be an analogy in those terms, though; it's meant to
match with the definition of gradient-line that linear gradients use.
When talking about gradient-lines, radial and linear gradients use
them nearly identically; the only things different are the default
values and how the ending-point is inferred.

> | Specifying angles *is* necessary, even if only to distinguish between
> | 0deg and 90deg.  If I were to do this, I would use keywords like [
> | horizontal | vertical | major | minor ] to specify which axis of the
> | ellipse to measure along.  I'm not completely certain this is actually
> | simpler, though.
>
> Your to-a-side, to-a-corner sizing *does* specify an angle when an angle is needed.

I recommend playing with the link I provided.  Just feed it the
contents of the radial-gradient() rule.  I've fixed up all the bugs I
can find, so it should work as I want.  (If you can still get an error
using valid syntax, send me the link - I don't care as much about
invalid syntax, because I didn't have the time/will to write a *fully*
intelligent CSS parser.)

Also, I'd keep the width/height fairly small, 300px or so at most.  If
you get too big it causes a noticeable delay as it churns, and eats up
my bandwidth.  ^_^

~TJ
Received on Monday, 7 September 2009 02:13:34 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:21 GMT