Styling a javascript link

[Jet]

I've got a javascript function to increase/decrease the text size of the page but the links are in the basic style (bright blue with an underline). How can I change this (colour, size) to fit in to the rest of the page.

HTML

<script type="text/javascript" src="textsizer.js">

/***********************************************
* Document Text Sizer- Copyright 2003 - Taewook Kang.  All rights reserved.
* Coded by: Taewook Kang (http://www.txkang.com)
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>

STUFF

<div id="textsize"><a href="javascript:ts('body',1)">+ Larger Font</font></a> <a
href="javascript:ts('body',-1)">+ Smaller Font</a></div>

CSS

#textsize {
	margin-top: 50px;
	width: 175px;
	margin-bottom: 0px;
	margin-left: 500px;
	position: absolute;
	height: 40px;
	color: #6C7F98;
	text-decoration: none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

Javascript

//Specify affected tags. Add or remove from list:
var tgs = new Array( 'body','td','tr');

//Specify spectrum of different font sizes:
var szs = new Array( 'xx-small','x-small','small','medium' );
var startSz = 1;

function ts( trgt,inc ) {
	if (!document.getElementById) return
	var d = document,cEl = null,sz = startSz,i,j,cTags;
	
	sz += inc;
	if ( sz < 0 ) sz = 0;
	if ( sz > 6 ) sz = 6;
	startSz = sz;
		
	if ( !( cEl = d.getElementById( trgt ) ) ) cEl = d.getElementsByTagName( trgt )[ 0 ];

	cEl.style.fontSize = szs[ sz ];

	for ( i = 0 ; i < tgs.length ; i++ ) {
		cTags = cEl.getElementsByTagName( tgs[ i ] );
		for ( j = 0 ; j < cTags.length ; j++ ) cTags[ j ].style.fontSize = szs[ sz ];
	}
}

Any ideas?

 

[Jet]

Change your css to, for example:

#textsize {
	margin-top: 50px;
	width: 175px;
	margin-bottom: 0px;
	margin-left: 500px;
	position: absolute;
	height: 40px;
}
#textsize a {
	color: #6C7F98;
	text-decoration: none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
#textsize a:hover {
	color: red;
	text-decoration:undeline;
}

The styling for the text goes in "a" (as in <a href...>). You can then have rollovers and stuff.

There shouldn't be a </font> in the html.

Excellent. Thank you. I know there shouldn't be font tags in there. It was a last resort lol.