W3C home > Mailing lists > Public > www-style@w3.org > March 2011

RE: [css3-transitions] grid property is animatable?

From: Alex Mogilevsky <alexmog@microsoft.com>
Date: Sat, 26 Mar 2011 00:41:31 +0000
To: Dean Jackson <dino@apple.com>, Andrew Fedoniouk <news@terrainformatica.com>
CC: www-style list <www-style@w3.org>, Kevin Babbitt <kbabbitt@microsoft.com>, Phil Cupp <pcupp@microsoft.com>
Message-ID: <D51C9E849DDD0D4EA38C2E539856928411EED057@TK5EX14MBXC212.redmond.corp.microsoft.com>
Well, "grid-columns" is not really a length. It is a formula for calculating multiple lengths. So transition may be from

                grid-columns:(minmax(200px, 1fr) auto)[40]
to
                grid-columns: 1.5fr (2em 1fr)[15] 2em 1.5fr

where number of columns changes and different fractions and repeat patterns are used. I am not sure I can even suggest how to calculate an intermediate state...

It would make sense however to animate changes to individual column widths. Syntax for that is now very tentative though (and it may also be tricky because grid rows and columns are not elements).

From: Dean Jackson [mailto:dino@apple.com]
Sent: Friday, March 25, 2011 5:09 PM
To: Andrew Fedoniouk
Cc: Alex Mogilevsky; www-style list; Kevin Babbitt; Phil Cupp
Subject: Re: [css3-transitions] grid property is animatable?


On 26/03/2011, at 3:40 AM, Andrew Fedoniouk wrote:


From: Alex Mogilevsky<mailto:alexmog@microsoft.com>
Sent: Thursday, March 24, 2011 5:45 PM
To: www-style list<mailto:www-style@w3.org>
Cc: Kevin Babbitt<mailto:kbabbitt@microsoft.com> ; Phil Cupp<mailto:pcupp@microsoft.com>
Subject: [css3-transitions] grid property is animatable?

css3-transitions [1] has "grid-*" in the list of animatable properties. What is the thinking on which grid properties could animate, and what it means?

http://dev.w3.org/csswg/css3-transitions/

grid-column/row widths/height I think.

For example transition from this:
   body { grid-columns: * 200px *; }
to this:
   body { grid-columns: * 700px *; }

makes sense as far as I can tell.

Right. Any property that is a number, length, angle, time, etc should be animatable. Performance may be horrible in some cases (eg. changing the size of grid columns).

Dean
Received on Saturday, 26 March 2011 00:42:04 GMT

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