0

クリック時に各 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;
     });
    });

ありがとう

ジェイミー

4

1 に答える 1

0

フェードインとフェードアウトではなく上下にスライドさせたい場合は、組み込みのアニメーションを使用できます:.slideUp()と.slideDown().

最初にフェードアウトしてからスライドアップしたい場合は、これを使用できます。

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

.fadeOut()完了すると、オブジェクトが非表示になり、機能しなくなるため、 使用できません.slideUp()。ただし、 を使用する.fadeTo()と、不透明度が変わるだけで、 を実行できます.slideUp()。

于 2012-03-19T15:48:23.793 に答える