Создание лайтбокса с поддержкой печати на веб-странице

Question

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

Звучит просто, но всегда есть препятствия. Поэтому я хотел бы знать, есть ли какой-нибудь рабочий пример, который поддерживает все основные браузеры.

Я искал в Google и нашел много лайтбоксов, но ни у одного из них нет встроенной кнопки печати. ​​

Answer 1

Предлагаю вам взглянуть на эту статью http://www.bennadel.com/blog/1591-Ask-Ben-Print-Part-Of-A-Web-Page-With-jQuery.htm

Он работает, временно создавая iframe, который не виден пользователю, и быстро помещает в него все содержимое для печати (например, просто div и его содержимое). Затем печатается содержимое iframe.

Между прочим, метод таблицы стилей может рассматриваться как "путь", но, по моему опыту, у него есть пара кросс-браузерных проблем.

edit: на самом деле, это похоже на то, что вы ищете http://plugins.jquery.com/project/jqPrint

Answer 2

Создайте новый документ CSS, в котором вы скрываете все, кроме лайтбокса - div. Включите эту таблицу стилей в свой документ с атрибутом media="print"

что-то вроде

<link rel="stylesheet" href="/stylesheets/print.css"
    type="text/css" media="print" />