I don't think you need a print event. All you need to do is adjust your @media print
styles based on your Javascript(?) criteria. When the user attempts to print the page, the @media print
style will apply and your styles will be in effect:
<html>
<head>
<style id="styles" type="text/css">
@media print { .noprint { display:none; } }
</style>
<script type="text/javascript">
var x = Math.random();
if (x > .5) {
var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = '@media print { .maybe_noprint { display:none; } }';
document.getElementsByTagName('head')[0].appendChild(style);
}
</script>
</head>
<body>
<div class="noprint">This will never print.</div>
<span class="maybe_noprint">This may print depending on the value of x.</span>
</body>
</html>
If you are using server-side criteria to determine what prints, then just have server-side code spit out @media print
to decorate the classes as necessary. Also, you may want to consider modifying an existing class that's already inside @media print
, or building up the new CSS using something other than innerHTML
, which I'll admit smells awful to me, but seems to work in Opera 9.6, Safari for Windows 3.1.2, IE 6 and Firefox 2.0.0.17 (I didn't test any other browsers).