Question

这变形很好，但我需要先暂停然后变形。

var animate = (function(){
    var div = document.getElement('div.es-transition');
    if (div){
        div.set('morph', {duration: 800, transition: 'quad:out'});
        div.pauseFx(1000, 'morph');
        div.addClass('hidden');
        div.setStyles({'visibility': 'hidden', 'opacity': 0});
        div.removeClass('hidden').fade('in');
    }
});

window.addEvent('load', animate);

敲打头。

TIA

Answer 1

不了解pauseFx？这不是标准的mootools-core api。它有http://mootools.net/docs/core/Fx/Fx#Fx:pause - 需要应用于实例。

在你的情况下，无论如何你都没有意义，因为你甚至在运行它之前就暂停了。这意味着，使用setTimeout或delay。 pause是在中途停止并恢复变形/补间。请澄清你想要实现的目标

也。 .set('morph')不适用于.fade() - 淡入淡出功能基于tween选项，而不是morph。补间和变形之间的区别是单个属性与多个属性。

如果我理解正确，你需要重写为：

var animate = (function(){
    var div = document.getElement('div.es-transition');
    if (div){
        div.set('tween', {duration: 800, transition: 'quad:out'});

        div.addClass('hidden');
        div.setStyles({'visibility': 'hidden', 'opacity': 0});

        (function(){
            div.removeClass('hidden').fade(0, 1);
        }).delay(1000);
    }
});

window.addEvent('load', animate);

为什么在变形之前这不会暂停？

1 个答案: