I am extremely new to Javascript and now very little about it. On the page I am working on, I want to open pdf files in a new window instead of a frame. However, it doesn't show the link as visited until the original page is refreshed.

Click <a href ="filename.pdf" onclick="window.open(this.href,'newwin'); return false"> here</a> is the javascript code that I am using to open the new window.

The Current code is:

<html>
<head>
<title>Lake Huron Learning Collaborative Inc. - LHLC</title>
<meta name="description"
content="The Lake Huron Learning Collaborative is a community-based non-profit organization dedicated to life-long learning and enhanced post-secondary educational choices along the Lake Huron Shoreline.">
<meta name="keywords"
content="Lake Huron Learning, Lake Huron Learning Collaborative, Huron County, Bruce County, Huron, Bruce, life-long learning, enhanced post-secondary, educational choices, University of Western, Western, UofW, Lake Huron Shoreline.">
<meta name="AUTHOR" content="DataQuest Consulting">
<meta http-equiv="CHARSET" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="LANGUAGE" content="English">
<style rolloverstyle="">A:hover {color: #0099CC; font-family: Tahoma; text-decoration: underline} a {text-decoration:none}
</style>
<style>
BODY {
scrollbar-face-color: #336789;
scrollbar-arrow-color: #FFFFFF;
scrollbar-track-color: #FFFFFF;
scrollbar-shadow-color: #FFFFFF;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-darkshadow-color: #FFFFFF;

}


</style><base
target="I1">
</head>
<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0"
style="color: rgb(0, 51, 153); background-color: rgb(255, 255, 255);"
alink="#008080" link="#004ea0" marginheight="0" marginwidth="0"
vlink="#3366ff">

******************

I was told that I could use javascript and css to change the class before and after. How do I do this, specifically?


The code I found, which gives an error, is:

<html>
<head>
<title>Example</title>
<style type="text/css">
a.beforeclick:link {color:#0000FF;font-size: 12pt;text-decoration:underline;font-weight:normal}
a.beforeclick:active {color:#00FF00;font-size: 12pt;text-decoration:underline;font-weight:normal}
a.beforeclick:visited {color:#FF0000;font-size: 12pt;text-decoration:underline;font-weight:normal}
a.beforeclick:hover {color:#00FF00;font-size: 12pt;text-decoration:underline;font-weight:normal}

a.afterclick:link {color:#FF0000;font-size: 12pt;text-decoration:underline;font-weight:normal}
a.afterclick:active {color:#00FF00;font-size: 12pt;text-decoration:underline;font-weight:normal}
a.afterclick:visited{color:#FF0000;font-size: 12pt;text-decoration:underline;font-weight:normal}
a.afterclick:hover {color:#00FF00;font-size: 12pt;text-decoration:underline;font-weight:normal}

</style>
<script type="text/javascript">

function launchPDF(PDFID){
alert("Would launch PDF here");
}
</script>
</head>

Then in the body:

a href="javascript:launchPDF(Report 09)"
onclick="this.className='afterclick';" class="beforeclick">Annual
Report 2009</a>

***************

line 1, character 18 expected ")", code 0 is the error I get.

At the VERY top of the page it says, <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN"

This web page was designed by someone else.
***********************
I assume I could still use the meta info and then the body I have:


<style>
BODY {
scrollbar-face-color: #336789;
scrollbar-arrow-color: #FFFFFF;
scrollbar-track-color: #FFFFFF;
scrollbar-shadow-color: #FFFFFF;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-darkshadow-color: #FFFFFF;

}


</style>
<base
target="I1">
</head>
<body topmargin="0" leftmargin="0" rightmargin="0" bottommargin="0"
style="color: rgb(0, 51, 153); background-color: rgb(255, 255, 255);"
alink="#008080" link="#004ea0" marginheight="0" marginwidth="0"
vlink="#3366ff">