da script nel testo a scriopt esterno

[Goo21]

Ciao,
non sono molto pratico di javascript
Volevo chiedervi come si passa da uno script inserito nel testo ad uno esterno?

In particolare mi riferisco a questo script:
<style>
.navbarMainHover{
background-color: #7A9EC5;
border: 1px solid #000000;
padding: 3px;
padding-left: 5px;
padding-right: 5px;
}

.navbarMain {
background-color: #5A7EA5;
border: 1px solid #000000;
border-left: 1px solid #999999;
border-top: 1px solid #999999;
padding: 3px;
padding-left: 5px;
padding-right: 5px;
}

.linkMain {
color: white;
font-family: Verdana, Arial, Helvetica;
font-size: 8pt;
font-weight: bold;
}

.linkSub {
color: black;
font-family: Verdana, Arial, Helvetica;
font-size: 8pt;
}

.navbarSubHover {
background-color: #D5DAE9;
padding: 2px;
padding-left: 5px;
padding-right: 5px;
border: 1px solid #000000;
border-left: 1px solid #999999;
border-top: 1px solid #999999;
}

.navbarSub {
background-color: #ffffff;
padding: 2px;
padding-left: 5px;
padding-right: 5px;
border: 1px solid #ffffff;
}
</style>
<script language="JavaScript">
mainBgColor = "#5A7EA5";
mainBgColorHover = "#7A9EC5";

subBgColor = "#ffffff";
subBgColorHover = "#D0D7E9";

mainStyle = "navbarMain";
mainStyleHover = "navbarMainHover";
subStyle = "navbarSub";
subStyleHover = "navbarSubHover";

function clk(obj){
if (document.all && obj.children.tags("A").length > 0 && obj.children.tags("a")[0].href)
obj.children.tags("A")[0].click();
else if (!document.all) {
if (obj.document && obj.document.links[0]) location.href = obj.document.links[0].href;
else if (obj.getElementsByTagName("a")){
var links = obj.getElementsByTagName("a");
if (links[0])
location.href = links[0].href;
}
}
}

function sOver(obj){
if (obj.className){
obj.className = subStyleHover;
if (obj.children){
if (obj.children.tags("A").length > 0 && obj.children.tags("A")[0].href != ""){
obj.style.cursor = "hand";
var link = obj.children.tags("A")[0];
status = link.href;
if (!obj.title) obj.title = link.href.split("/")[link.href.split("/").length - 1];
}
else status = obj.innerText;
}
else if (obj.getElementsByTagName("a")) status = obj.getElementsByTagName("a")[0].href;
}
else {
obj.bgColor = subBgColorHover;
if (obj.document.links[0]) status = obj.document.links[0].href;
}
}

function sOut(obj){
status = "";
if (obj.className){
obj.style.cursor = "";
obj.className = subStyle;
}
else obj.bgColor = subBgColor;
}

function mOver(obj){
if (obj.className){
obj.className = mainStyleHover;
if (obj.children){
if (obj.children.tags("A").length > 0 && obj.children.tags("A")[0].href != ""){
obj.style.cursor = "hand";
var link = obj.children.tags("A")[0];
status = link.href;
if (!obj.title) obj.title = link.href.split("/")[link.href.split("/").length - 1];
}
else status = obj.innerText;
}
else if (obj.getElementsByTagName("a")) status = obj.getElementsByTagName("a")[0].href;
}
else {
obj.bgColor = mainBgColorHover;
if (obj.document.links[0]) status = obj.document.links[0].href;
}
}

function mOut(obj){
status = "";
if (obj.className){
obj.style.cursor = "";
obj.className = mainStyle;
}
else obj.bgColor = mainBgColor;
}

function cap(obj){
if (document.layers){
obj.captureEvents(Event.MOUSEUP);
obj.captureEvents(Event.MOUSEOVER);
obj.captureEvents(Event.MOUSEOUT);
obj.onmouseup = function (e) { clk(obj); }
obj.onmouseover = function (e) { eval(obj.name.substring(0,1).toLowerCase() + "Over(obj);"); }
obj.onmouseout = function (e) {eval(obj.name.substring(0,1).toLowerCase() + "Out(obj);"); }
}
}
</script>

che in body viene così richiamato

<tr><td class="navbarMain" onmouseover="mOver(this);" onmouseout="mOut(this);" onclick="clk(this)">
<ilayer><layer id="Main" width="100%" onload="cap(this)">Freephp.html.it</layer></ilayer></td></tr>
<tr><td class="navbarSub" onmouseover="sOver(this);" onmouseout="sOut(this);" onclick="clk(this)">
<ilayer><layer id="Sub" width="100%" onload="cap(this)">FREEPHP</layer></ilayer></td></tr>


come lo rendo esterno?...grazie

[Goo21]

scusate...ho risolto
non mi fungeva perchè mi ero scordato di mettere il css

grazie lo stesso....ciao