Shuvalov Lev » tag http://shuvalov.com system administrator Fri, 20 Apr 2012 09:24:34 +0000 en hourly 1 http://wordpress.org/?v=3.2.1 print page JavaScript http://shuvalov.com/print-page-javascript/?utm_source=rss&utm_medium=rss&utm_campaign=print-page-javascript http://shuvalov.com/print-page-javascript/#comments Sat, 11 Apr 2009 07:05:21 +0000 Lev Shuvalov http://www.shuvalov.com/?p=268 There is a JavaScript funcion into the HEAD tag. This funtion force to initiate printing process of your browser therefore its behaving depends on the browser.

<head>
<link rel='stylesheet' type='text/css' href='/include/screen.css' media='screen' />
<link rel='stylesheet' type='text/css' href='/include/print.css' media='print, handheld' />

<script language="JavaScript">
function print_overall(){
 window.print();
}
</script>
</head>

Somewhere in the body of HTML document should be a call of that funtion. Like that:

<div class="print">
<form>
  <input type="button" value="Print this page" onclick="print_overall()">
</form>
</div>

You can combine the function declaration and call

<div class="print">
<form>
  <input type="button" value="Print this Page" onClick="window.print()" />
</form>
</div>

or

<span class="print">
  <a href="JavaScript:window.print();">Print this page</a>
</span>

The class “print” I use to hide printing elements on a hard copy of the document.

/*=========================================================== screen.css */
.print {
  text-align:center;
}
/*=========================================================== print.css */
.print {
  visibility: hidden;
}
]]> http://shuvalov.com/print-page-javascript/feed/ 0