Выбор элемента :visible

[dikucher]

Пациент
После каждого ряда "блоков с картинкой", идет пунктирная линия. Ее я реализовал через добавления класса ( который в свою очередь добавляет псевдоэлемент) к первому "блоку с картинкой" и к каждому 4n+5. Вывод блоков меняется в зависимости от выбранного фильтра ( сверху: Квартиры Котеджы ...) поэтому, мне после нажатия на фильтр надо заново переопределить первый и 4n+5 элементы.
первый определятеся корректно

$('.items-bl li:visible:first')

Мне нужно определить из видимых "блоков с картинкой" 4n+5, это я делают следующим образом

$('.items-bl li:visible:nth-child(4n + 5)')

НО 4n+5 он считает не из видимых элементов, а из всех элементов.
Как мне выбрать 4n+5 именно из видимых элементов ?

[melky]

Попробуй так:

$('.items-bl li:visible').filter(':nth-child(4n + 5)')

[dikucher]

проблема остаётся, ведет себя так же

[dikucher]

На сколько я понял, работает следующая логика
Выбираются элементы 4n+5, и если они visible, то селектор срабатывает
повторюсь, мне надо
чтобы сначала выбрало visible элементы, и уже в них рассчитало 4n+5

[melky]

На сколько я понял, работает следующая логика
Выбираются элементы 4n+5, и если они visible, то селектор срабатывает
повторюсь, мне надо
чтобы сначала выбрало visible элементы, и уже в них рассчитало 4n+5

не

он выбирает :visible, потом из них выбирает 4n+5

проблема в том, что он в "n" учитывает скрытые - т.е. в n индекс относительно дерева, а не коллекции

решение - callback.

я попробовал так :
http://jsbin.com/ImeWoRiT/1

[dikucher]

вот как я изменил код ( срабатывает при клике на любую кнопку из фильтра ) посмотреть там же тест

jQuery(function ($) {
        var hide = $('.filter');

        var collection = $('.items-bl li');

        hide.click(function () {
            collection.removeClass('line');
            collection.filter(':visible').filter(function (index) {
                var isMatching = index && index % 4 === 0;
                return isMatching;
            }).add(collection.last()).addClass('line');
        });



        collection.removeClass('line').filter(':nth-child(4n+5), :first').addClass('line');

    });

но что то идет не так

[melky]

обрати внимание на css по моей ссылке

[kostyanet]

Точно, пациент. Миленький транзистор. Лучше бы починили fancybox или как он там, который бедолага не масштабируется и демонстрирует еще более прелестные полосы прокрутки вокруг оконца с фоткой.

Ответ, конечно, не по существу, но я предлагаю поменять существо с ковыряния в жикверях на дизайн, масштабируемость и все такое. Потому что эти пунктиры ну вообще там никуда. Это я как дизайнер вам говорю.

[melky]

Точно, пациент. Миленький транзистор. Лучше бы починили fancybox или как он там, который бедолага не масштабируется и демонстрирует еще более прелестные полосы прокрутки вокруг оконца с фоткой.

Ответ, конечно, не по существу, но я предлагаю поменять существо с ковыряния в жикверях на дизайн, масштабируемость и все такое. Потому что эти пунктиры ну вообще там никуда. Это я как дизайнер вам говорю.

от программиста требуется сверстать и оживить то, что нарисовал дизайнер.

правка программистом конечного варианта дизайна строго карается.

так то, ясный красный, они там не к месту

[dikucher]

не суть, к месту эти линии там или нет. Нарисовали - значит нужно делать.
melky у меня проблема в следующем, ( я хоть и изменил немного ваш код, но вроде не поломал его логики ). Но он зараза по прежнему определят мне 4n+5 из всех элементов, а ведь должен определять этот 4n+5 из видимых

jQuery(function ($) {
        var hide = $('.filter');

        var collection = $('.items-bl li');

        hide.click(function () {
            collection.removeClass('line');
            collection.filter(':visible').filter(function (index) {
                var isMatching = index && index % 4 === 0;
                return isMatching;
            }).add(collection.last()).addClass('line');
        });



        collection.removeClass('line').filter(':nth-child(4n+5)').addClass('line');

    });

верстка лежит все там же