Drawer Slide (抽屉滑入)

面板从底部边缘向上滑出，通常可以拖动，并吸附到几个固定高度。

在[应用位置]添加“底部抽屉上滑”(Bottom Sheet Slide-Up)，也叫底部抽屉(bottom drawer)或面板(sheet)。
面板从底部边缘向上滑出，同时后方页面变暗，平滑减速停到位，不要回弹。
每次打开面板都播放一次，关闭时再滑回下方；面板打开期间，键盘焦点要留在面板内部。

元素从容器边缘之外滑入到停靠位置，不带淡入效果。

在[应用位置]添加“滑入”(Slide In)入场动画，也叫 slide in left、slide in right、slide in up 或 slide in down。
元素从容器边缘之外滑到停靠位置，全程保持完全不透明：快速，平滑减速，不要回弹。
在容器边缘处裁切，避免它在外面时遮住相邻元素或产生滚动条；如果用户开启了“减少动态效果”(prefers-reduced-motion)，则直接在原位显示。

新页面从一侧滑入，旧页面同时滑出，方向跟随导航层级。

在[应用位置]添加“页面滑动过渡”(Slide Page Transition)，也叫 push / pop 或 directional slide。
前进时，新页面从侧边推入，旧页面从另一侧滑出；后退时两者反向移动：平滑，起止都要缓和。
方向要与导航层级对应，包括浏览器的返回按钮；滑动过程中页面不能出现横向滚动。

一层半透明的深色遮罩在浮层后方淡入，让页面变暗。

在[应用位置]添加“遮罩层淡入”(Backdrop Scrim Fade)，也叫浮层淡入(overlay fade)或遮罩(scrim)。
浮层打开时，一层半透明的深色遮罩在后方页面上柔和地淡入，比浮层本身稍慢一点；关闭时再淡出。
无论浅色还是深色主题，遮罩都保持深色；遮罩显示期间，后方页面不能滚动，也不能响应点击。

布局变化后，元素平滑地移动到新的位置和尺寸。

在[应用位置]添加“FLIP布局动画”(FLIP Layout Animation)，也叫布局动画(layout animation)或 First-Last-Invert-Play。
布局变化时，每个元素从旧位置平滑移动到新位置，而不是直接跳过去：开始时快，最后轻柔地落定。
只用 transform 做动画，避免页面每一帧都重新排版；如果用户开启了“减少动态效果”(prefers-reduced-motion)，直接切换到新布局。

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

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

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

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