Hi,
Try using Alternate stylesheets.
<link id="styNormal" title="Normal" rel="alternate stylesheet" type="text/css" href="Normal.css" media="screen" />
<link id="styPrintPreview" title="Print Preview" rel="alternate stylesheet" type="text/css" disabled="disabled" href="PrintPreview.css" media="screen" />
You can the use the stylesheets collection in javascript to toggle the disabled attribute of each of the external stylsheets.
Note: you will need to add also a media="Print" link also so that when your page is actually printed that it will use the same "PrintPreview" stylesheet.
<link rel="stylesheet" type="text/css" href="PrintPreview.css" media="print" />
so you end up with a block of style links that looks like
<link rel="stylesheet" type="text/css" href="PrintPreview.css" media="print" />
<link id="styNormal" title="Normal" rel="alternate stylesheet" type="text/css" href="Normal.css" media="screen" />
<link id="styPrintPreview" title="Print Preview" rel="alternate stylesheet" type="text/css" disabled="disabled" href="PrintPreview.css" media="screen" />
Regards.
Rob^_^