Javascript Event Handler For Print

I am trying to alter style at print-time: Is there an event in javascript that you can listen for for when file>>print is called? What is it? Also - is there a handler for

Solution 1:

Different Style Sheets

You can specify a different stylesheet for printing.

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

One Style Sheet

As kodecraft mentioned, you can also put the styles into the same file by using the @media block.

@media print {
    div.box {
        width:100px;
    }
}

@media screen {
    div.box {
        width:400px;
    }
}

Solution 2:

In IE there are the nonstandard window.onBeforePrint() and window.onAfterPrint() event listeners. There isn't a non-IE way to do it that I know of, however.

What kinds of changes are you trying to make? It's possible that your problem could be solved by specifying different rules for your print stylesheet.

Solution 3:

Firefox 6 now supports beforeprint and afterprint

https://developer.mozilla.org/en/Printing#Detecting_print_requests

Solution 4:

We also found that you can do a print-only style with the following:

<styletype="text/css">@media print {
    div
    {
        overflow:visible;
    }    
}
</style>