"If You Can Dream It, We Can Build It"
Let us help your dream come true in web and multimedia design and development to open the doors to the digital world.
Use JavaScrip to Print
Click here for Working Example (open in new window)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script language="javascript">
function CallPrint(strid)
{
<!-- Grabs the area selected from div tag ...-->
var prtContent = document.getElementById(strid);
var WinPrint = window.open('','','letf=10,top=10,width="450",height="250",toolbar=1,scrollbars=1,status=0');
<!-- Applying the css and title for the print document...-->
WinPrint.document.write("<html><head><LINK rel=\"stylesheet\" type\"text/css\" href=\"css/print.css\" media=\"print\"><LINK rel=\"stylesheet\" type\"text/css\" href=\"css/print.css\" media=\"screen\"></head><body>");
WinPrint.document.write(prtContent.innerHTML);
WinPrint.document.write("</body></html>");
WinPrint.document.close();
WinPrint.focus();
WinPrint.print();
WinPrint.close();
}
</script>
</head>
<body><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr bgcolor="#FFFF99">
<td><strong>Header </strong></td>
<td> </td>
</tr>
<tr bgcolor="#FFFF99">
<td> </td>
<td> </td>
</tr>
<tr bgcolor="#FFFF99">
<td><strong>I dont want this part to be print </strong></td>
<td><form name="form1" method="post" >
<a href="#" onClick="javascript:CallPrint('divPrint');"> <input type="submit" name="Submit" value="Print"></a>
</form></td>
</tr>
</table>
<!-- specify the print area by using a div tag-->
<div id="divPrint">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td bgcolor="#CCCCFF">I want the print this area. </td>
</tr>
<tr>
<td bgcolor="#CCCCFF"> </td>
</tr>
<tr>
<td bgcolor="#CCCCFF">This area can contains dynamic data or pictues or anything you want your website visitors to print. </td>
</tr>
<tr>
<td bgcolor="#CCCCFF"> </td>
</tr>
<tr>
<td bgcolor="#CCCCFF"> </td>
</tr>
<tr>
<td bgcolor="#CCCCFF"> </td>
</tr>
<tr>
<tr>
<td>Copyright the content</td>
</tr>
</table>
</div>
<!-- print area ends -->
</body>
</html>
Sample print.css
body,td,th {
font-size: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
Next: Print Dynamic Pages Using JavaScripts
Please use any of this content to improve your web and if you have any questions please feel free to contact microsector.net
Click here for Working Example (open in new window)
|