FLIP Layout Animation (FLIP布局动画)

元素仿佛移动并缩放到新位置上对应的元素，看起来是同一个对象。

在[应用位置]添加“共享布局动画”(Shared Layout Animation)，也叫页面内共享元素(in-page shared element)。
选中项变化时，元素要从旧位置平滑地移动并缩放到新位置，轻柔地落定，让人看出这是同一个对象而不是两个。
任何时刻只显示一份，移动过程中不要让周围布局跳动。

列表项添加时淡入并滑入，删除时以动画退出，相邻项随之补上空位。

在[应用位置]添加“列表项进出”(List Item Enter/Exit)动画，也叫动画列表(animated list)。
新项先撑开自己的空间，再淡入并滑入；被删除的项先淡出，再收起高度，让相邻项平滑地补上空位。
被删除的项要等退出动画结束后才移除，这样添加或删除项目时列表不会跳动。

应用筛选或排序时，网格中的卡片重新排列、淡出或滑到新的位置。

在[应用位置]添加“瀑布流重排”(Masonry / Grid Shuffle)效果，也叫可筛选网格动画(filterable grid animation)。
应用筛选时，不再匹配的卡片在原地缩小并淡出，剩下的卡片平滑地滑到新位置；清除筛选时反向播放。
网格高度变化时不要让周围页面跳动；筛选控件要用真正的按钮，并标明当前选中的是哪个筛选。

拖动某一项时，其他项滑开让位，并按新的顺序排好。

在[应用位置]添加“拖拽排序列表”(Drag-to-Reorder List)，也叫可排序列表(sortable list)。
被拖动的项直接跟随指针并轻微抬起，其他项平滑地滑开让位；松开后，它迅速落入最近的位置。
同时支持触屏和鼠标，并提供用键盘移动项目的方式，把新位置播报给屏幕阅读器。

一行内容横向无缝地无限循环滚动。

在[应用位置]添加“跑马灯”(Marquee)，即水平方向无限滚动的条带，也叫 ticker。
内容从右向左以缓慢、匀速的速度滚动，无缝循环，衔接处不能出现跳动。
鼠标悬停时暂停；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则停止滚动。