Question

animation: scaleUp 0.3s linear 0.4s forwards;

animation: scaleDown 0.3s linear forwards;

嗨，我在尝试过滤内容时动画内容。我正在尝试将上面的这两个css规则添加到下面的javascript代码中，当'隐藏所有不共享我们类的元素'和'显示所有共享myClass的元素'但我真的不知道如何打开和关闭标签，因为我不太了解Javascript。如果你能帮助我，我会非常感激。感谢。

$(document).ready(function() {
$('#filterOptions li a').click(function() {
    // fetch the class of the clicked item
    var ourClass = $(this).attr('class');

    // reset the active class on all the buttons
    $('#filterOptions li').removeClass('active');
    // update the active state on our clicked button
    $(this).parent().addClass('active');

    if(ourClass == 'all') {
        // show all our items
        $('#ourHolder').children('div.item').show();    
    }
    else {
        // hide all elements that don't share ourClass
        $('#ourHolder').children('div:not(.' + ourClass + ')').hide();

        // show all elements that do share ourClass
        $('#ourHolder').children('div.' + ourClass).show();
    }
    return false;
});

}）;

Answer 1

除非我遗漏某些内容，否则我认为没有理由说明以下内容无效：

$("#ourHolder").css("animation","scaleUp 0.3s linear 0.4s forwards");

或

$("#ourHolder").css({"animation" : "scaleUp 0.3s linear 0.4s forwards"});

然而，将css添加到类并切换类是非常好的做法。

就像一张纸条，我不确定你想要什么样的选择器，我只选择了#ourHolder作为例子。

如何将CSS规则插入javascript？

1 个答案: