height - Mootools Morph 高度和背部

Question

我正在寻找解决方案：我想切换 Div 的高度但不完整。所以我尝试了这个，但没有奏效。我看到萤火虫的第一个类变化和高度变为 36px。但是后面没有用。我尝试添加和删除类。

http://jsfiddle.net/Zbbd9/1/

$$('.outer').setStyle('height', '660px');

$$('.outer h2').addEvent('click', function(){
    if (this.hasClass('close')) {
        var parent = this.getParent();
        parent.removeClass('close');
        parent.morph({
        'height': '660px'
      });
    } else {
        var parent = this.getParent();
        parent.addClass('close');
        parent.morph({
        'height': '36px'
      });
    }
});

更新：

http://jsfiddle.net/Zbbd9/2/

知道了。

最好的祝福

Answer 1

您选择了错误的父容器。

试试这样：

$$('.outer h2').addEvent('click', function(){
    var parent = this.getParent();
    if (parent.hasClass('close')) {
        parent.removeClass('close');
        parent.morph({
            'height': '660px'
        });
    } else {
        parent.addClass('close');
        parent.morph({
            'height': '36px'
        });
    }
});

添加一个类来识别当前状态是一种可靠的方法，但您可能还需要考虑其他替代方案，例如使用toggleClass或引用完全不同的东西，如滑块或类似的东西。