jQuery: как сделать так, чтобы контент не отображался с помощью overflow: hidden?

Я пытаюсь распределить контент на несколько страниц (div), установленных на высоте 950 пикселей на div, чтобы я мог правильно выводить в pdf.

Я начинаю с одного div, в который вложен весь контент, используя overflow: hidden. В идеале я хотел бы использовать jquery для поиска контента, который находится вне области просмотра (скрыт), но я не вижу никаких функций для этого. $...(':visible') применяется только к display: none или visible: hidden...

Контент на этих страницах имеет базовую html-разметку (p, br, ol, ul, li, h1, h2). Я пробовал зацикливать эти дочерние элементы и находить их смещение сверху. Проблема в том, что это становится чрезвычайно запутанным и сложным, когда вы пытаетесь измерить расстояние от элемента, зацикленного до верхней части страницы, когда последующие страницы имеют переменную высоту содержимого (на каждой странице есть блок заголовка, который выше содержания).

Идеи?


person Jono    schedule 16.09.2010    source источник


Ответы (1)


Вам нужно сравнить положение каждого элемента с высотой документа (body):

if ($("#elementOne").position().top > $("body").height()){
    // This element is hidden
}

В этом примере сканируется каждый элемент и создается массив скрытых элементов (полностью):

var h = $("body").height();
var hiddenEls = new Array();

$("#container").find("*").each(function(){
    if ($(this).position().top > h)
        hiddenEls.push($(this));
});

Обратите внимание, что это не проверено.

Попробуйте этот пример:

http://jsfiddle.net/wMPjJ/

Синий контейнер имеет высоту 400px со скрытым переполнением. В div есть 22 p элемента, пронумерованных от 1 до 22. Некоторые будут скрыты (не помещаются). Код на странице сообщит вам, сколько элементов скрыто (для меня я получаю 5; p теги с 17 по 22 не отображаются)

person Chris Laplante    schedule 16.09.2010
comment
Разве .position() не означает, что это относительно позиционированного контейнера? - person Hari Pachuveetil; 17.09.2010
comment
@Флойд Пинк; Да вы правы. Но в данном случае это не имеет значения, потому что спрашивающий хочет обнаружить только те элементы, которые скрыты контейнером div, чей overflow установлен на hidden. Если бы вся страница имела заданную высоту со скрытым переполнением, вы бы использовали offset() вместо position(). - person Chris Laplante; 17.09.2010