onbeforeprint() and onafterprint() equivalent for non IE browsers

Many browsers now support window.matchMedia. This API allows you to detect when CSS media queries go into effect (e.g., rotating the screen or printing the document). For a cross-browser approach, combine window.matchMedia with window.onbeforeprint/window.onafterprint.

The following may result in multiple calls to beforePrint() and afterPrint() (for example, Chrome fires the listener every time the print preview is regenerated). This may or may not be desirable depending on the particular processing you're doing in response to the print.

if ('matchMedia' in window) {    // Chrome, Firefox, and IE 10 support mediaMatch listeners    window.matchMedia('print').addListener(function(media) {        if (media.matches) {            beforePrint();        } else {            // Fires immediately, so wait for the first mouse movement            $(document).one('mouseover', afterPrint);        }    });} else {    // IE and Firefox fire before/after events    $(window).on('beforeprint', beforePrint);    $(window).on('afterprint', afterPrint);}

More: http://tjvantoll.com/2012/06/15/detecting-print-requests-with-javascript/

I m not sure other browsers will allow you to. You could of course specify an image somewhere in a print stylesheet, which probably only will be called on a print, for the onbeforeprint

Try masking the native window.print() with your own...

// hide our vars from the global scope(function(){  // make a copy of the native window.print  var _print = this.print;  // create a new window.print  this.print = function () {    // if `onbeforeprint` exists, call it.    if (this.onbeforeprint) onbeforeprint(this);     // call the original `window.print`.    _print();     // if `onafterprint` exists, call it.    if (this.onafterprint) onafterprint(this);  }}())

Updated: comments.