JQuery nth-ребенок работает неправильно

Я использую селектор nth-child jQuery для изменения поля на каждом 3-м div с классом photo_post_thumbnail, но он изменяет его каждый 2-й div?

может ли кто-нибудь определить, что я делаю неправильно?

сайт

http://www.clients.eirestudio.net/hatstand/wordpress/photos/

HTML-разметки

<div class="postbox photo_post_thumbnail">
      blah blah
</div>

<div class="postbox photo_post_thumbnail">
      blah blah
</div>

<div class="postbox photo_post_thumbnail">
      blah blah
</div>

Код JQuery

$('.photo_post_thumbnail:nth-child(3n)').css('margin-right', '0px');

2 ответов


он делает это потому, что у вас есть <h1> перед этими divs, что делает div 4-го ребенка не третьим:)

на nth-child селектор сначала немного запутан, потому что это nth-child родитель не только nth-child соответствие этому селектору родительского селектора селектор не имеет позиции для этого селектора.

чтобы получить div, который вы хотите, сделайте 3n+1 такой:

$('.photo_post_thumbnail:nth-child(3n+1)').css('margin-right', '0px');

альтернативное решение :

   $('.photo_post_thumbnail').each(function(i) {
      i=(i+1);
      if(i%3==0){
     $(this).css("margin-right","0px"));
    }
   });