Создание версии для печати страницы сайта (вариант на JavaScript)
Добавляем на сайт версию для печати, реализованную на javascript
На некоторых сайтах можно найти такую ссылку "Версия для печати". Эта ссылка выводит в облегченную версию материала, предназначенную для распечатки на принтере. Попробуем реализовать подобное при помощи JavaScript.
Для начала, сам скрипт:
Code
Теперь нужно пометить ту часть материала, которую выведем на печать. Это сделаем при помощи DIV.
Code
MessForPrint - это тот id, состав которого будем на печать отправлять.
Теперь сделаем ссылку, по которой будем открывать окно с облегченным текстом.
Code
В качастве параметра для функции atoprint передаем id div блока. Все, просмотр сделан. Теперь нажав на ссылку "Версия для печати" будет открываться новое окно с облегченным содержанием для печати. Незабудьте заменить копирайт в скрипте на свой, иначе я стану автором Вашего материала
Для начала, сам скрипт:
Code
<script type="text/javascript" language="javascript"><!--
function atoprint(aId) {
var atext = document.getElementById(aId).innerHTML;
var captext = window.document.title;
var alink = window.document.location;
var prwin = open('');
prwin.document.open();
prwin.document.writeln('<html><head><title>Версия для печати<\/title><\/head><body text="#000000" bgcolor="#FFFFFF"><div onselectstart="return false;" oncopy="return false;">');
prwin.document.writeln('<div style="margin-bottom:5px;"><a href="javascript://" onclick="window.print();">Печать<\/a> • <a href="javascript://" onclick="window.close();">Закрыть окно<\/a><\/div><hr>');
prwin.document.writeln('<h1>'+captext+'<\/h1>');
prwin.document.writeln(atext);
prwin.document.writeln('<hr><div style="font-size:8pt;margin-top:20px;">© Портал SzenProgs.ru<\/div>');
prwin.document.writeln('<div style="font-size:8pt;">Страница материала: '+alink+'<\/div>');
prwin.document.writeln('<div style="margin-top:5px;"><a href="javascript://" onclick="window.print();">Печать<\/a> • <a href="javascript://" onclick="window.close();">Закрыть окно<\/a><\/div>');
prwin.document.writeln('<\/div><\/body><\/html>');
}
--></script>
Прописываем его в теле HEAD, или выносим в отдельный js файл.Теперь нужно пометить ту часть материала, которую выведем на печать. Это сделаем при помощи DIV.
Code
<div id="MessForPrint">Тут текст сообщения для печати...</div>
MessForPrint - это тот id, состав которого будем на печать отправлять.
Теперь сделаем ссылку, по которой будем открывать окно с облегченным текстом.
Code
<a href="javascript://" onclick="atoprint('MessForPrint');">Версия для печати</a>В качастве параметра для функции atoprint передаем id div блока. Все, просмотр сделан. Теперь нажав на ссылку "Версия для печати" будет открываться новое окно с облегченным содержанием для печати. Незабудьте заменить копирайт в скрипте на свой, иначе я стану автором Вашего материала
Другие статьи этой тематики:
3 комментариев
Для WordPress лучше брать плагин WP-Print. Или посмотрите его на офф. сайте wordpress.org
кто нить знает как можно ее сохранить такую?
Плиз подскажите и вкакая функция сахранения в браузерах или они разные для разных браузеров?
Leave a Comment