Question

我有一个过滤器操作正在按照我希望每个div淡入或淡出点击的方式工作;然而，当div消失或进入时，我不希望跳过它，而是希望看到它们滑入到位。

http://theoaks.turnpostadmin.com/floor-plans/

我可以添加什么来使其像jquery.easing或其他东西一样发生

这是我到目前为止所拥有的

    $(document).ready(function() {
     $('#filter a').click(function() {
      $(this).css('outline','none');
      $('#filter .current').removeClass('current');
      $(this).parent().addClass('current');

    var filterVal = $(this).text().toLowerCase().replace(' ','-');

    if(filterVal == 'all') {
        $('ul#portfolio li.hidden').fadeIn('slow').removeClass('hidden');
    } else {

        $('ul#portfolio li').each(function() {
            if(!$(this).hasClass(filterVal)) {
                $(this).fadeOut('normal').addClass('hidden');
            } else {
                $(this).fadeIn('slow').removeClass('hidden');
            }
        });
    }

    return false;
     });
    });

由于

杰米

Answer 1

如果您只是希望它们上下滑动而不是fadeIn和fadeOut，则可以使用内置动画：.slideUp()和.slideDown()。

如果你想让他们首先fadeOut然后slideUp，你可以使用它：

$(this).fadeTo('normal', 0).slideUp('normal').addClass('hidden');

你不能使用.fadeOut()，因为当它完成时，它会隐藏使.slideUp()无法工作的对象。但是，如果您使用.fadeTo()，则只会更改不透明度，然后您可以运行.slideUp()。

Jquery在显示过滤器之后滑动

1 个答案: