Question

首先感谢人们帮助我回答了我的大部分问题。我是mootools的新手，真的需要一些特殊的东西帮助，如链接功能，效果等。

我想淡出一个表上的整个列，但事情是我填充表和页面加载的行，并隐藏我不想显示的列（静态是5列）。但我有删除整个列的功能，然后必须在最后出现一个新列。隐藏列有一个显示无的类。我正在使用moootools删除所选列，我希望mootools首先出现在show column上，并带有效果，如淡入。

以下是我的功能：

$$('.RemoveColumn').each(function (el) {
    el.addEvent('click', function (e)
    {
        DeleteCurrentColumn(el.get('id'));
        ShowNextColumn();
    })
})

function DeleteCurrentColumn(id) {
    var identifier = '.columnclass' + id;
    $$(identifier).each(function (el) {
        el.dispose();
    })
}

function ShowNextColumn() {
    var firstNoDisplay = $$('.noDisplay')[0]; // Select first item with nodisplay class
    var MyId = firstNoDisplay.get('id');
    if ((firstNoDisplay != null) && (MyId)) {
        var identifier = '.columnclass-' + MyId;
        $$(identifier).each(function (el) {
            if (el.hasClass('noDisplay'))
                el.removeClass('noDisplay');
        })
    }
}

我想我必须将列的所有元素的不透明度设置为0和淡入淡出......但是无法弄清楚如何：（

提前致谢！

Answer 1

您可以使用：

function ShowNextColumn() {
    var firstNoDisplay = document.getElement('.nodisplay'); // Select first item with nodisplay class
    var MyId = firstNoDisplay.get('data-id');
    if ((firstNoDisplay != null) && (MyId)) {
        var identifier = '.columnclass' + MyId;
        $$(identifier).each(function (el) {
            if (el.hasClass('nodisplay')) el.fade('in');
        })
    }
}

Demo

我改变了什么：

使用.fade('in')来淡化io并使用opacity: 0;代替display: none;
使用document.getElement('.nodisplay');代替$$('.noDisplay')[0];并注意该类应为小写
在此处删除了班级名称中的-：'.columnclass-' + MyId;

Mootools淡化所有列表？

1 个答案:

Demo