Print sections that were hidden on the screen with javascript

I have run into a small problem I have not encounte开发者_如何学Pythonred before: I use javascript (jQuery) to show different sections of information in tabs on a web-page. So what I´m doing, is hiding the tabs that are not being viewed and only showing the tab that is being viewed.

This works very well, but now I am adding a print-specific style-sheet and I want to print the information of all tabs and not just the one being viewed.

How can I undo the javascript hiding of these sections for the print style-sheet?

Edit: Some additional information:

I am using jQuery to hide all div.tabs sections and in my print style-sheet I have set:

.wrapper div.tabs sections {
    display: block;
}

assuming that the higher value of .wrapper div.tabs sections compared to div.tabs sections would make the sections visible. But it doesn´t...

The best approach would be to change the JavaScript so that it modified the classes that applied to the elements and didn't modify .style.display. Then you could target elements with those classes differently with the screen and print media stylesheets.

The quick and dirty approach would be to use !important in your print media stylesheet.

All you really need is CSS. Just define some things that show when printed.

Heres and example:

@media print {
    div.print_show{ dispay: block; }
    span.print_show{ display: inline; }
    .print_hide{ display: none; }
}

You can add an extra class to add display:block to your print.css..