0

スタイリングされた記事がいくつかありますが、それ自体は生意気です

padding-bottom: 125px
padding-top: 125px
border-bottom: 1px solid rgba(0,0,0,0.1)
&:first-of-type
    padding-top: 0
    &:last-of-type
        padding-bottom: 0
            border-bottom: none

カテゴリがクリックされたときに、同様のクラスを持たないすべての記事をフェードアウトさせるスクリプトがあります

// Category Switching
$('.cats span').click(function(){
    console.log('click');
    var cat = $(this).attr('class');
    if(cat == 'all'){
        $('.articles').find('article').fadeIn();
    } else {
        $('.articles').find('article:not(.'+cat+')').fadeOut();
    }
});

明らかに、最初の記事だったものが最初の記事ではない可能性があるため、投稿の上部のパディングを削除する必要があります。しかし、CSS は既にレンダリングされているため、DOM に変更があったことを認識していません。

CSS で DOM を再評価し、このスクリプトの実行後にこれらの変更を確認するにはどうすればよいですか?

4

1 に答える 1

0

表示されているすべての要素を選択できます。したがって、実行した後、:visible であるすべてをfadeIn選択fadeOutできます。.articles

ドキュメント:

http://api.jquery.com/visible-selector/

次に、最初と最後の dom 要素を選択し、それらに.last_article and.first_article` css クラスを与えることができます。

（これらのクラスには、たとえば上下のパディングが必要です）

于 2014-06-06T15:55:44.347 に答える