Javascript print...removing stuff from the actual printout

A

AngryJim

Limp Gawd
Joined
Apr 20, 2006
Messages
234
I'm new to javascript, so please bear with me.

Is there any way to hide certain portions of a page so that they do not show up when printed? I currently have two javascript links on a page that is meant to be printed, one is the "back" command and the other is the "print" command, and they are kind of aesthetically unappealing.

I realize I could just remove them or move everything else to a "printer-friendly" page, but I'd rather just keep everything as-is and have them not show up on the printed page...if that's possible. Thanks.
 
That looks like a good start.

My CSS skills are next to nonexistent. My site currently uses a CSS template I found online which I modified slightly by changing a few small parameters.

Thanks for the help!
 
AngryJim said:
I'm new to javascript, so please bear with me.

Is there any way to hide certain portions of a page so that they do not show up when printed? I currently have two javascript links on a page that is meant to be printed, one is the "back" command and the other is the "print" command, and they are kind of aesthetically unappealing.
Click to expand...

this can be easily done using CSS, providing you know any CSS. The basic idea is to create a print only stylesheet
E.g.
Code: 
<html.....>
<head>
.
.
<style type="text/css" media="print">
.noprint
{
   display: none;
}
</style>
.
.
</head>
<body>
<div class="noprint"><a href="somelocation.htm" onclick="dosomething()">My Javascript link</a></div>
.
.
</body>

this wil make anything of class "noprint" not be displayed when the page is printed, it will still display when viewed on the screen, whcih I believe is what you want to do?
 
Would this do it? This is the full CSS from my site, with what I added from maw's post underlined.

Code: 
body {
	color:#333;
	background-color:white;
	margin:20px;
	padding:0px;
	font:11px verdana, arial, helvetica, sans-serif;
	}
h1 {
	margin:0px 0px 15px 0px;
	padding:0px;
	font-size:28px;
	font-weight:900;
	color:#ccc;
	}
h2 {
	font:bold 12px/14px verdana, arial, helvetica, sans-serif;
	margin:0px 0px 5px 0px;
	padding:0px;
	}
p {
	font:11px/20px verdana, arial, helvetica, sans-serif;
	margin:0px 0px 16px 0px;
	padding:0px;
	}
.Content>p {margin:0px;}
.Content>p+p {text-indent:30px;}

a {
	color:#09c;
	font-size:11px;
	font-family:verdana, arial, helvetica, sans-serif;
	font-weight:600;
	text-decoration:none;
	}
a:link {color:#09c;}
a:visited {color:#07a;}
a:hover {background-color:#eee;}

.content {
	position:relative;
	width:auto;
	min-width:120px;
	margin:0px 210px 20px 170px;
	border:1px solid black;
	background-color:white;
	padding:10px;
	z-index:3;
	}

[U].noprint
{
   display: none;
}[/U]

#navAlpha {
	position:absolute;
	width:150px;
	top:80px;
	left:20px;
	border:1px none;
	background-color:#eee;
	padding:10px;
	z-index:2;
	voice-family: "\"}\"";
	voice-family:inherit;
	width:128px;
	}

body>#navAlpha {width:128px;}

#navBeta {
	position:absolute;
	width:190px;
	top:80px;
	right:20px;
	border:1px none;
	background-color:#eee;
	padding:10px;
	z-index:1;
	voice-family: "\"}\"";
	voice-family:inherit;
	width:168px;
	}

body>#navBeta {width:168px;}
 
You must log in or register to reply here.
Back
Top