RE: in-between values

Tab Atkins Jr. wrote on Friday, January 21, 2011 10:26 AM
> To: Brad Kemper
> Cc: www-style list
> Subject: Re: in-between values
> 
> On Fri, Jan 21, 2011 at 9:54 AM, Brad Kemper 
> <brad.kemper@gmail.com> wrote:
> > I had an idea for a special value that could be used with a 
> variety of properties, for transitioning, animating, or just 
> picking single values that are in between two values that 
> don't normally have any mid-points. So for instance:
> >
> > background-clip: mid(border-box, padding-box, 0.24) /* 
> would clip 1/4 
> > of the way from border-box to padding-box */
> >
> > background-clip: mid(padding-box, border-box, 0.24) /* 
> would clip 1/4 
> > of the way from padding-box to border-box */
> >
> > color: mid(transparent, blue, 0.7) /* equivalent to color:blue; 
> > opacity:0.7 */
> >
> > color: mid(blue, transparent, 0.7) /* equivalent to color:blue; 
> > opacity:0.3 */
> >
> > border-style: mid(dashed,solid,0.5) /* spaces between 
> dashes are half 
> > their normal length */
> >
> > border-style: mid(dashed,none,0.5) /* spaces between dashes 
> are twice 
> > their normal length, and used border-width is half of 
> specified value 
> > */
> >
> > overflow: mid(visible, hidden, 0.5) /* overflow is visible, but 
> > semi-opaque */
> >
> > This wouldn't work for everything, and we'd have to define 
> what property values it did work for. New modules could 
> define how it worked for their own values.
> 
> I think something like this is definitely a good idea.  I had 
> considered introducing it in Image Values, but decided 
> instead to just make an explicit cross-fade() function.  
> mid() is a much better name than what I was thinking of using 
> - interpolate().
> 
> The Transitions spec can define mid() in general, and then, 
> as you say, individual modules can define if it applies to 
> new properties and values they define, and how.
> 
> I would recommend that the third value should be either a 
> <number> between 0 and 1 or a <percentage> between 0% and 100%.
> 
> I also think an optional fourth argument detailing the 
> transition strategy should be allowed.  Most 
> properties/values only have one transition strategy named 
> 'auto', but some can be transitioned in different ways, like 
> <color> transitioning in rgb or hsl.
> 

Actually color could transition three ways:  rgb, hsl (increasing h),
hsl (decreasing h) with zero-crossing as needed.

Hope this helps,
Charles Belov
SFMTA Webmaster

Received on Friday, 21 January 2011 19:13:21 UTC