Re: [css-grid] Are grid positions animatable?

On 15 November 2013 02:27, Daniel Holbert <dholbert@mozilla.com> wrote:
>
> On 11/14/2013 05:45 PM, Jon Rimmer wrote:
> > Hi all,
> >
> > Apologies if this has been asked before, but I'm wondering if the position
> > of items in a grid layout are intended to be animatable? The properties in
> > the spec do not specify one way or the other.
>
> I'd expect that the properties themselves are individually animatable,
> where it makes sense. But their interpolated values won't produce any
> sort of intermediate sliding around behavior like the demos that you
> linked to.
>
> e.g. take "order" (a number, which impacts the grid position) for a
> simple example. It can be transitioned between numeric values. But
> intermediate "order" values don't produce intermediate overlaid grid
> positions. At each instant in time, an "order" animation has a fixed
> current value, which produces a particular ordering of the items.

Hmm, I can see how that makes sense with how transitions works on most
properties, but it will be a real shame if grid doesn't provide some
mechanism for doing this. We have all this wonderful new machinery for
laying out elements, but people will have fall back to doing
everything with JS libraries, absolute positioning and transforms to
get animation between positions? That doesn't seem right.

What about adding a cross-fade-esque interpolation function to the
grid placement properties? Something like "tween-position"? So could
apply a transition on say, grid-row-start, and during a transition
between say, 1 and 5,, the calculated value would be grid-row-start:
tween-position(1, 5, 50%)?

Or alternatively, a grid-transition property, that specifies an
interpolation that applies to all grid items when they move to the
positions determined by the layout algorithm?

I don't know. Maybe these ideas are crazy, but I think it would suck
not to have some way of doing this.

Jon

Received on Friday, 15 November 2013 03:38:47 UTC