Print preview from multiple iframes?

Question

I have several iframes in a page. I want to show in a print preview all the iframe contents as snapshots of iframes. I used window.print() for individual iframe

Answer 1

You need to focus all frames one-by-one and merge in print report.

You can achieve it, with this code:

HTML:

Print this page

Awesome Print Report

JavaScript:

function printPage() {

    window.print();

    for (var k = 0; k < window.frames.length; k++) {
        window.frames[k].focus();
        window.frames[k].print();
    }

}

CSS:

#header {
    margin - top: 20px;
}

@media print {
    #printButton {
        display: none;
    }
}

This CSS will hide print button on printed report.

Here is JsFiddle for you: http://jsfiddle.net/zur4ik/r7pvF/