I am trying to hide some divs before the user prints this giant form, then display the divs again afterward. Thus I want to ignore the rest of the page, and only print the form itself.
Sure I could open a separate page when the user clicks the print button. The only thing is that the form is really long and it would be quite tedious to do that.
Edit: My previous question did not actually reflect what I was looking for. So I changed it to the current one.
Also thanks to all that suggested window.onbeforeprint and window.onafterprint. That was relevant to my edited question.
Take a look at window.onbeforeprint and window.onafterprint (the original question asked about how to do it programmatically I believe).
A better way to do this is with a style that is specifically for printing. In other words, your div might look like this:
<div class="someClass noPrint">My Info</div>
You would then have this in your stylesheet:
.someClass {font-family:arial;}
@media print {
.noPrint { display: none; }
}
You could also put this in a separate stylesheet if you wanted so you don't have to mix styles:
<link rel="stylesheet" type="text/css" media="print" href="print.css">
Your screen stylesheet could have ".someClass" defined one way and then your print stylesheet could have it defined a completely different way.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With