MooTools教程(11):Fx.Morph、Fx选项和Fx事件

作者佚名技术来源网页制作浏览发布时间 2012-03-07

unit（单位）

这个选项设置了数字的单位。例如，你的100是指100个像素（px）、百分比还是em？

参考代码： [复制代码] [保存代码]

// 建立你的渐变或者形变
// 然后在大括号{ }之间设置你的选项
var morphObject = new Fx.Morph(morphElement, {
unit: ''%''
});

link（连接）

link选项提供了一种方式可以让你管理多个启动效果的函数调用。例如，如果你有一个鼠标移上去（mouseover）的效果，你是希望每次用户移上去都启动这个效果吗？或者是，如果一个人把鼠标移上去两次，它应该忽略第二个响应还是应该把它们串连起来，然后等第一次调用完成以后再第二次调用这个效果？link又三个设置：

“ignore”（默认）——在一个效果没有完成之前忽略任何启动新效果的调用
“cancel”——如果有另外一个效果调用，则放弃当前的效果，转而处理新的效果调用
“chain”——链可以让你把效果像“链条”一样把效果连接起来，把这些调用进行堆栈，然后逐一调用这些效果，直到完成

参考代码： [复制代码] [保存代码]

// 建立你的渐变或者形变
// 然后在大括号{ }之间设置你的选项
var morphObject = new Fx.Morph(morphElement, {
link: ''chain''
});

duration（持续时间）

duration可以让你定义这个动画的持续时间。持续事件和速度是不一样的，因此如果你想让一个对象在一秒内移动100个像素，那么它将比一个每秒移动1000个像素的对象要慢。你可以输入一个数字（以毫秒为单位）、一个值为数字的变量或者三个快捷方式：

“short”=250ms
“normal”=500ms（默认）
“long”=1000ms

参考代码： [复制代码] [保存代码]

// 建立你的渐变或者形变
// 然后在大括号{ }之间设置你的选项
var morphObject = new Fx.Morph(morphElement, {
duration: ''long''
});
// 或者这样
var morphObject = new Fx.Morph(morphElement, {
duration: 1000
});

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢!

分享到：更多

你可能对下面的文章感兴趣

上一篇: rails制作rss feed下一篇: javascript变量作用域在不同浏览器的处理

关于MooTools教程(11):Fx.Morph、Fx选项和Fx事件的所有评论

随机推荐