Is there any solution to disable Javascript style changes in print?
For instance, if I'm hiding something through Javascript but I want to include that hidden info in print.
I hid a div using Javascript and I want to show that div if Javascript is disabled. Now the problem is, because div is hidden using Javascript it's also not showing when the page is printed.
Use a print stylesheet, along with !important statements to force the element to be visible for printing.
<link rel="stylesheet" href="print.css" type="text/css" media="print" />
CSS:
#myDiv { display: block!important; }
I suggest you take a look at this article: CSS Design: Going to Print.
Grz, Kris.
The use of !important has already been mentioned, but it is a blunt instrument and things get very complicated once you start needing to override things which are already !important.
One of the great benefits of CSS is that it allows you to separate style from structure. Instead of using JS to manipulate the style of an element, use it to manipulate the structure. For example, by manipulating the className property.
Your screen media stylesheet can then hide the element, while leaving it visible for the print media stylesheet.
This has the additional benefit that you don't need to think about having to override these styles as they won't apply in the first place (for print).