MooTools - Fx.Options

您将收到以下输出 :

输出

点击开始按钮以查找变形动画.这有助于我们观察用于动画的帧数.为fps使用不同的值来获得动画的差异.建议使用小于10的fps值.这将帮助您轻松获得差异.

unit

此选项用于设置数字的单位类型.通常，我们有三种不同类型的单位 -  px，％和ems.看看下面的语法.

语法

var morphObject = new Fx.Morph(morphElement, {   unit: '%'});

以上语法是为单位分配百分比.这意味着数字中的所有值都被视为百分比.

link

此选项提供了一种管理多个调用以启动动画的方法.如果您一次应用多个事件呼叫，这些呼叫将作为链接呼叫接收.第一次通话结束后，第二次通话自动执行.它包含以下三个选项 :

• 忽略 : 这是默认选项.它会在完成效果之前忽略任意数量的调用.

• 取消 : 当有另一个制作时，这取消了当前效果.它遵循最新的通话优先权.

• 链 : 这使您可以将效果链接在一起并保持一组调用.它执行所有调用，直到它遍历堆栈中的所有链接调用.

查看以下语法以使用链接选项.

语法

var morphObject = new Fx.Morph(morphElement, {   link: 'chain'});

持续时间

此选项用于定义动画的持续时间.例如，如果您希望对象在1秒的持续时间内移动100px，那么它将比在1秒内移动1000px的对象慢.您可以输入以毫秒为单位的数字.或者您可以使用这三个选项中的任何一个来代替数字.

• 短= 250毫秒

• 正常= 500毫秒(默认)

• 长= 1000毫秒

查看以下使用持续时间的语法.

语法

var morphObject = new Fx.Morph(morphElement, {   duration: 'long'});

或者，

  var morphObject = new Fx.Morph(morphElement ，{持续时间:1000 });

转换

此选项用于确定转换类型.例如，如果它应该是平滑过渡或者应该从慢慢开始然后加速到最后.请查看以下语法以应用转换.

语法

var morphObject = new Fx.Morph(morphElement, {   duration: 1000});

下表描述了不同类型的转换.