动画

彩色主动暂停CSS动画/过渡, SVG动画, 以及防止误报的视频. 十博体育备用网址这么做是因为十博体育备用网址控制范围之外的多个变量使得十博体育备用网址无法保证毫秒级的动画绘制是一致的.

CSS动画

半音会暂停CSS动画并将其重置为开始状态.

一些动画用于“动画”可见元素. 若要指定半音动画应该在结束时暂停,请使用 pauseAnimationAtEnd 故事参数:

MyComponent / /添加.故事.js MyComponent |添加.故事.ts

进口 MyComponent  '.MyComponent /添加';

出口 默认的 {
  组件: MyComponent,
};

常量 Template = (arg游戏) => <MyComponent {...arg游戏} />;

出口 常量 StoryName = Template.绑定({});
StoryName.参数 = {
  //通知彩色暂停动画时,他们完成特定的故事.
  彩色: { pauseAnimationAtEnd: 真正的 },
};

你可以用故事书的 参数 继承,如果你想为你的整个应用设置行为:

// .故事书/预览.js

出口 常量 参数 = {
  //通知彩色暂停动画时,他们完成在一个全局级别.
  彩色: { pauseAnimationAtEnd: 真正的 }
};

JavaScript动画

彩色不能禁用JavaScript驱动的动画, 所以十博体育备用网址建议禁用这些动画手动的彩色构建. 一种方法是使用 isChromatic ():

// .故事书/预览.js
进口 isChromatic  '彩色/ isChromatic';

if (isChromatic()) {
  //具体的方法取决于你的动画技术.
  AnimationLibrary.禁用 = 真正的;
}

无法禁用的动画

如果你不能禁用动画(例如禁用JS动画很困难), 你可以使用 Delay 允许动画在拍摄快照之前完成.

另外, 忽略一个元素 在比较快照时省略组件的可见区域.

友情链接: 1 2 3 4 5 6 7 8 9 10