Высота каждого элемента выше, чем функция - PullRequest
0 голосов
/ 28 сентября 2011

Добрый день, я пытаюсь понять, как сделать маленькую вещь.

У меня есть несколько элементов на странице, которые необходимо проверить по высоте, и если высота выше, например> 100, то янужно вызвать функцию для них.

Итак, я дошел до этого:

var filterHeight = $('div.class').height();

if (filterHeight > 100) {
    $('div.class').css('height', '100px');
    $('div.class').css('overflow-y', 'scroll');
}

Проблема с этим, как вы знаете, заключается в том, что он добавит эти параметры ко всем элементам, потому что я строго указываюк этому.

Полагаю, мне нужно что-то сделать с .each (), но ...

Спасибо за ваши предложения и помощь.


Поскольку я не могу ответить на свой собственный вопрос, я обновляю здесь.


Я использовал ваше решение и немного изменил его, вместо того, чтобы добавить встроенный css, я добавил класс, который выбирает css.

Итак, что я сделал:

1) Когда страница загружается

$('div.class').each(function() {
    if ($(this).height() > 200) {
        $(this).addClass('scroller');
    }
});

.scroller {
height: 200px;
overflow-y: scroll !important;

}

Итак, он проверил все блоки с высотой более 200 пикселей и добавил класс.

2) После того, как я позвонил в Ajax / JOSN и он дал мне новые данные для тех блоков, которые мне нужно было проверить,SE элементы высотных изменений.Итак, по завершению .ajax я удалил класс и снова проверил.

 complete: function () {
        $('.box.refine .middle ul').removeClass('scroller')           
        $('.box.refine .middle ul').each(function() {
            if ($(this).height() > 200) {
                $(this).addClass('scroller');
            }
        });      
    }

Вот и все.

Ответы [ 3 ]

2 голосов
/ 28 сентября 2011

Вам нужно взглянуть на jQuery .each ()

Что-то вроде:

$('.check-these').each( function(){
    if ($(this).height() > 100) {
        $(this).css('height', '100px');
        $(this).css('overflow-y', 'scroll');
    }
});

Это не проверено, но должно поставить вас на правильный путь.

1 голос
/ 28 сентября 2011
$('div.class').each(function(){
    if($(this).height() > 100)
    {
        $(this).css({height: "100px", overflow-y: "scroll"});
    }
});
0 голосов
/ 28 сентября 2011

Просмотрите все элементы и проверьте каждый в отдельности:

$('div.class').each(function() {
    if ($(this).height() > 100) {
        $(this).css('height', '100px').css('overflow-y', 'scroll');
    }
});

Но почему бы просто не вставить это в css для начала?

div.class {
    height: 100px;
    overflow-y: scroll;
}
...