Modifying print stylesheets

Temporarily modifying the print styling from within a page remains permanen

[Urchin]

I have a academic site within a VLE (WebCT Vista) for which I provide the facility to change some aspects of the styling of the page on the fly. These changes are saved in a cookie, and applied on the next startup of any page for this site. The CSS has separate default stylings for print and screen in one stylesheet, using the @media command. All this works well.

I have been trying to persuade it to allow the user to change the print styling. I have set up a set of print preferences, which are intended to be alterable and saveable as a cookie. I have a javascript function (linked to a "Print Page" ) something like:

function printPage() {
assignPrintPrefs();
window.print();
setTimeout("assignScreenPrefs();", 60000);
}

where assignPrintPrefs() and assignScreenPrefs() set the various styling attributes, with lines such as:

setFontFamily(printPrefs[2]);

The function succeeds in performing the first two statements, but will not restore the screen preferences. I tried the setTimeout function on the assumption that the problem may be the delay in spooling the file to the printer.

I have tried a "Reset Style" link that calls the assignScreenPrefs:

<a href="Javascript:assignScreenPrefs();">Restore</a>

which does absolutely nothing.

Is it possible to explicitly access the screen and print styles using javascript?

[Urchin]

I have sussed out part of the reason that my pages were not printing as desired, but I still have not solved the problem generally.

Can anyone help with advice on accessing the print styles as opposed to the screen styles embedded in the stylesheet?

[penders]

Hi Urchin, I have not tried what you are specifically trying to do, but it sounds as if your

assignPrintPrefs();

function would in fact alter the 'screen' styles which would then be overridden by your @media styles defined in your stylesheet when the page is actually printed - so your PrintPrefs would have little effect. (?)

Or are you trying to alter the stylesheet itself (via the styleSheets[] array)?! (Very problematic cross-browser).

What exactly does the setFontFamily() function do? I don't *think* this is a standard function?! Does it try to set the font on the body element?

I would have thought that in order to allow your users to set print styles... you would need to set all styles using JS. I don't think you will be able to override @media print styles. Perhaps set @media print styles only for styles you know aren't going to change?

Or... use a server-side script (PHP maybe) to dynamically create your stylesheet (with the user preferences) before printing - although this would require a link to an alternate print-page?