0
animation: scaleUp 0.3s linear 0.4s forwards;

animation: scaleDown 0.3s linear forwards;

嗨,我试图在过滤内容时为内容设置动画。当'隐藏所有不共享我们的类的元素'和'显示所有共享ourClass的元素'但我真的不知道如何打开和关闭标签,因为我对 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;
});

});

4

1 回答 1

1

除非我遗漏了某些东西,否则我看不出以下内容不起作用的原因:

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

或者

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

但是,将 css 添加到类并切换类绝对是一种更好的做法。

就像一个注释,我不确定你会想要什么选择器,我只是选择了#ourHolder一个例子。

于 2013-08-01T02:10:58.697 回答