Log in

View Full Version : how to put this in .js


fsaghar
11-29-2005, 06:10 PM
hello everyone i need ur help i wanna put this javascript menu to put in .js file to dynamic update link on my every pages thanks here are complete codes ..........


<style>
table.menu{
visibility:hidden;
background="ff9898";
position:absolute;
}
</style>

<script language="javascript">
function show(t){
document.all(t).style.visibility="visible";
}
function hide(t){
document.all(t).style.visibility="hidden";}

function changecolor(t){
document.all(t).style.background="#ccDcFC"
}
function restore(t){
document.all(t).style.visibility="hidden"}



</script>



<body>


<table border="0" cellspacing="1" style="border-collapse: collapse" bordercolor="#111111" width="100%" id="AutoNumber1" cellpadding="0">
<tr>
<td width="20%" onmouseover="show('home')" onmouseout="restore('home')"><b>Home</b></td>
<td width="20%" onmouseover="show('fun')" onmouseout="restore('fun')"><b>Fun</b></td>
<td width="20%" onmouseover="show('guest')" onmouseout="restore('guest')">
<b>Guest Books </b> </td>
<td width="20%" onmouseover="show('tut')" onmouseout="restore('tut')"><b>Tutorial</b></td>
<td width="20%" onmouseover="show('new')" onmouseout="restore('new')"><b>News</b></td>
</tr>
<tr>
<td width="20%">
<table class="menu" id="home" border="0" cellspacing="0" cellpadding="0" width="100%" bordercolor="#111111" height="100%" style="border-collapse: collapse">
<tr>
<td width="100%" onmouseover="show('home')" onmouseout="restore('home')">
<b>
<a href="aboutme.html">About Me</a></b></td>
</tr>
<tr>
<td width="100%" onmouseover="show('home')" onmouseout="restore('home')">
<b>
<a href="feedback.html">E-mail Me</a></b></td>
</tr>
<tr>
<td width="100%" onmouseover="show('home')" onmouseout="restore('home')">
<b>
<a href="friends.html">Pictures</a></b></td>
</tr>
</table></td>
<td width="20%">
<table class="menu" id="fun" border="0" cellspacing="0" cellpadding="0" width="100%" bordercolor="#111111" height="100%" style="border-collapse: collapse">
<tr>
<td width="100%" onmouseover="show('fun')" onmouseout="restore('fun')">
<b>
<a href="card.html">Greetings Card</a></b></td>
</tr>
<tr>
<td width="100%" onmouseover="show('fun')" onmouseout="restore('fun')">
<b>
<a href="mail.html">Free E-mail</a></b></td>
</tr>
<tr>
<td width="100%" onmouseover="show('fun')" onmouseout="restore('fun')">
<b>
<a href="sms.html">SMS</a></b></td>
</tr>
<tr>
<td width="100%" onmouseover="show('fun')" onmouseout="restore('fun')">
<b>
<a href="horsocope.html">Horoscope</a></b></td>
</tr>
<tr>
<td width="100%" onmouseover="show('fun')" onmouseout="restore('fun')">
<b>
<a href="http://pub25.bravenet.com/freelink/show.php?usernum=2135725467&cpv=1">Free Links</a></b></td>
</tr>
</table>
</td>
<td width="20%">
<table class="menu" id="guest" border="0" cellspacing="0" cellpadding="0" width="100%" bordercolor="#111111" height="100%" style="border-collapse: collapse">
<tr>
<td width="100%" onmouseover="show('guest')" onmouseout="restore('guest')">
<b>
<a href="card.html">Sign</a></b></td>
</tr>
<tr>
<td width="100%" onmouseover="show('guest')" onmouseout="restore('guest')">
<b>
<a href="mail.html">View</a></b></td>
</tr>
</table>
</td>
<td width="20%">
<table class="menu" id="tut" border="0" cellspacing="0" cellpadding="0" width="100%" bordercolor="#111111" height="100%" style="border-collapse: collapse">
<tr>
<td width="100%" onmouseover="show('tut')" onmouseout="restore('tut')">
<b>
<a href="http://oars.cc.iitk.ac.in/" target=_new>Code Project</a></b></td>
</tr>
<tr>
<td width="100%" onmouseover="show('tut')" onmouseout="restore('tut')">
<b>
<a href="http://www.techiwarehouse.com">TeachWireHouse</a></b></td>
</tr>
<tr>
<td width="100%" onmouseover="show('tut')" onmouseout="restore('tut')">
<b>
<a href="http://www.w3schools.com/" target=_new>W3Schools</a></b></td>
</tr>
<tr>
<td width="100%" onmouseover="show('tut')" onmouseout="restore('tut')">
<b>
<a href="http://hotwired.lycos.com/webmonkey/" target=_new>Web Monkey</a></b></td>
</tr>
</table>
</td>
<td width="20%">
<table class="menu" id="new" border="0" cellspacing="0" cellpadding="0" width="100%" bordercolor="#111111" height="100%" style="border-collapse: collapse">
<tr>
<td width="100%" onmouseover="show('new')" onmouseout="restore('new')">
<b>
<a href="http://www.cnn.com/" target=_new>CNN</a></b></td>
</tr>
<tr>
<td width="100%" onmouseover="show('new')" onmouseout="restore('new')">
<b>
<a href="http://www.bbc.com" target=_new>BBC</a></b></td>
</tr>
<tr>
<td width="100%" onmouseover="show('new')" onmouseout="restore('new')">
<b>
<a href="http://www.jang.com.pk" target=_new>Jang News</a></b></td>
</tr>
<tr>
<td width="100%" onmouseover="show('new')" onmouseout="restore('new')">
<b>
<a href="http://www.umat.com.pk" target=_new>Umat News</a></b></td>
</tr>
<tr>
<td width="100%" onmouseover="show('new')" onmouseout="restore('new')">
<b>
<a href="http://www.indiatimes" target=_new>India Times</a></b></td>
</tr>
</table>

</td>
</tr>
</table>





thanks
jscheuer1
11-30-2005, 03:59 AM
This is not such a hot idea. Unless you are willing to leave the HTML portion on each page, users without javascript enabled will be lost. It can be done though, using document.write in an external script combined with or in addition to one for the javascript code that you already have. The styling could be on an external stylesheet. It would be better (from an accessibility standpoint) to either use server side includes of some type, a frames set up or a template at the top of each page that can be edited all at one pass using an editor that will do that sort of thing.