Monday, March 26, 2012

Please help - how to create a Printer Friendly web page...

Dear Experts,
I've got a trouble problem that I need your help. The scenario is the
following:

1) I need to add a "Print" button to my web page;
2) by clicking this button, the web page should be able to print out a
well-formatted web page (printer friendly ). That means, I need to adjust the
printing margins (left, top, right, bottom) programmatically.

I really have no idea on how to achieve this but I know this is a very
typical scenario. Could you please give me some advices? Please help.

Thanks a lot.
TiggerAs long as the targetted browser is IE >= 5 you can use the onbeforeprint
and on afterprint events in javascript
(I found this out yeterday)
I wrote the code below to hide a print button and decrease the width when
the document is printed
Hope this helps,
mortb

<head>
<script language="javascript">
var originalWidth;
function window.onbeforeprint()
{
originalWidth = document.getElementById('_tblResult').style.width;
document.getElementById('_tblResult').style.width = '625px';
document.getElementById('_btnPrint').style.display = 'none';
}
function window.onafterprint()
{
document.getElementById('_tblResult').style.width = originalWidth;
document.getElementById('_btnPrint').style.display = 'inline';
}
</script>
</HEAD
"Tigger" <Tigger@.discussions.microsoft.com> wrote in message
news:C2D9F1F1-954D-448A-A201-BAAA332C866E@.microsoft.com...
> Dear Experts,
> I've got a trouble problem that I need your help. The scenario is the
> following:
> 1) I need to add a "Print" button to my web page;
> 2) by clicking this button, the web page should be able to print out a
> well-formatted web page (printer friendly ). That means, I need to adjust
> the
> printing margins (left, top, right, bottom) programmatically.
> I really have no idea on how to achieve this but I know this is a very
> typical scenario. Could you please give me some advices? Please help.
> Thanks a lot.
> Tigger
>
Use a media-specific print stylesheet.
For example, try slapping this in a file called print.css
@.page { 0.75in; }
And putting this line in your HTML
<link rel="stylesheet" type="text/css" href="http://links.10026.com/?link=print.css" media="print"
At this point, you should be able to print from your browser normally. If
you need to initiate printing from a button, you should be able to do
something like this:
<input type="button" value="Print me!" onclick="window.print()"
This article might give you some ideas on other things you can do with this
techinque: http://www.alistapart.com/articles/goingtoprint/
And there's always the CSS reference: http://www.w3.org/TR/CSS21/

"Tigger" wrote:

> Dear Experts,
> I've got a trouble problem that I need your help. The scenario is the
> following:
> 1) I need to add a "Print" button to my web page;
> 2) by clicking this button, the web page should be able to print out a
> well-formatted web page (printer friendly ). That means, I need to adjust the
> printing margins (left, top, right, bottom) programmatically.
> I really have no idea on how to achieve this but I know this is a very
> typical scenario. Could you please give me some advices? Please help.
> Thanks a lot.
> Tigger
>
>

0 comments:

Post a Comment