В настоящее время я работаю над печатью кое-чего. У меня есть динамическая страница с переменным количеством элементов блочного уровня. Некоторые могут быть 1 строкой, а некоторые могут быть 100+ строк.
<div class='myclass'><span id="id1">1</span>text 1 line....</span></div>
<div class='myclass'><span id="id2">2</span>text 10 lines....</span></div>
<div class='myclass'><span id="id3">3</span>text 3 lines....</span></div>
<div class='myclass'><span id="id4">4</span>text 100+ lines....</span></div>
...
Я знаю разрыв страницы внутри: избежать; когда он реализован (поддерживается Opera, Chrome и IE7+ только в строгом режиме html), предполагается, что элемент блочного уровня не обтекает 2 страницы. Поскольку этот тег css не поддерживается в браузерах, мне интересно, есть ли какие-либо обходные пути?
Я пытался использовать jquery, пост-рендеринг и измерять каждый элемент на странице, добавляя высоту, и когда последний элемент в сумме превышал высоту страницы, я добавляю разрыв страницы до: всегда этот элемент, но это работает только в том случае, если я предполагаю определенный размер страницы, а это никогда не является хорошим предположением.
sudo code only
document.ready(function(){
var pagesize = 100;
var currentheight;
$('.myclass').each(function(){
if (currentheight + this.getHeight() > pagesize || this.getHeight > pagesize) {
this.css('page-break-before', 'always');
currentheight = this.getHeight() % pagesize;
}
});
});
И я не хочу просто добавлять разрыв страницы до/после :always к каждому элементу, потому что не имеет смысла иметь 1 вкладыш на одной странице.
