Главная Юзердоски Каталог Трекер NSFW Настройки

Web-мастера

Ответить в тред Ответить в тред
Check this out!
<<
Назад | Вниз | Каталог | Обновить | Автообновление | 2 1 2
формирование печатного документа из страницы в chrome. Анонимус 25/06/22 Суб 22:18:39 135893 1
pagenumber1.jpg 11Кб, 268x222
268x222
Допустим, есть вот веб-страничка, по сути являющаяся печатным документом. При просмотре на экране она не делится на страницы, а при печати начинает делиться. И хотелось бы снизу каждой странички и сверху добавить некий заголовок и номер страницы в нем. Можно сделать всё очевидно как, проблема с номером страницы. Есть очевидное решение в css, где @page { @bottom: content: counter(page); }. Оно прекрасно работает даже в доисторическом фаерфоксе. Но оно не работает в самом популярном веб-браузере -- хроме.

Использовать сторонние ресурсы,вроде print.js и т.п. -- нельзя по разным соображениям и работать вообще должно без инета. Как сделать с опорой только на собственные силы? Ну очевидно, после window.load отмерить вертикальный размер, разделить на размер страницы в пикселях -- тут уже трудности, т.к. размеры страниц могут оказаться разные, размеры окантовки (padding/margin) разные... Но примерно угадать можно. И потом налепить элементов с номерами страниц с position:absolute. Всё бы работало знай точные размеры... Наверное можно как-то повесить условно-невидимый элемент с position:fixed на всю страницу и из его размера вычислить число страниц. Если между отрендеренными страницами нет неизвестного промежутка из-за неизвестного padding/marting. И непонятно как его померить.

Подскажите что-нибудь. Т.е. имеем html -> печатаем в pdf -> печатаем на принтер -> можем сложить разрозненные листы в документ.


Волосатая веб-макака 26/06/22 Вск 23:28:57 135899 2
А зачем в pdf конвертировать? Может проще сразу на печать отдавать? Притом, печатать необязательно то что видит пользователь. Можно сделать как-то так:

<div id="print-content">
Содержимое для печати
</div>




<script>
function CallPrint(strid) {
var prtContent = document.getElementById(strid);
var prtCSS = '<link rel="stylesheet" href="/templates/css/template.css" type="text/css" />';
var WinPrint = window.open('','','left=50,top=50,width=800,height=640,toolbar=0,scrollbars=1,status=0');
WinPrint.document.write('<div id="print" class="contentpane">');
WinPrint.document.write(prtCSS);
WinPrint.document.write(prtContent.innerHTML);
WinPrint.document.write('</div>');
WinPrint.document.close();
WinPrint.focus();
WinPrint.print();
WinPrint.close();
prtContent.innerHTML=strOldOne;
}
</script>

Вот от сюда кусок кода свистнул: https://palpalych.ru/blog/javascript-pechat-html-stranicy
Ответить в тред Ответить в тред

Check this out!

Настройки X
Ответить в тред X
15000
Добавить файл/ctrl-v
Стикеры X
Избранное / Топ тредов