Hi all,
I'm trying to use JavaScript to display the sub-menu on mouse over using the following script:
<script type="text/javascript">
var sublinks = new Array();
// links for about section
sublinks[0] = new Array();
sublinks[0][0] = { href: 'about.htm', innerHTML: 'About the Senators | ' };
sublinks[0][1] = { href: 'about_perc.htm', innerHTML: 'About the Senators Percussion | ' };
sublinks[0][2] = { href: 'profiles.htm', innerHTML: '2005 Line Profile | ' };
// links for news section
sublinks[1] = new Array();
sublinks[1][0] = { href: 'news.htm', innerHTML: 'News | ' };
sublinks[1][1] = { href: 'news_archive', innerHTML: 'News archive | ' };
sublinks[1][2] = { href: 'latest_news.htm', innerHTML: 'Latest News | ' };
// links for Archive
sublinks[2] = new Array();
sublinks[2][0] = { href: 'archive.htm', innerHTML: 'Archive | ' };
sublinks[2][1] = { href: 'media.htm', innerHTML: 'Media | ' };
sublinks[2][2] = { href: 'shows.htm', innerHTML: 'Shows | ' };
sublinks[2][3] = { href: 'alumni.htm', innerHTML: 'Member Alumni | ' };
var n=0;
function displayLinks
{
var sub = document.getElementById('subLinks');
sub.innerHTML = '';
for (var i=0;i<sublinks[n].length;i++) {
sub.innerHTML += '<a href="'+ sublinks[n].href +'">'+ sublinks[n].innerHTML +'</a>';
sub.innerHTML += (i<(sublinks[n].length-1)) ? ' | ' : '';
}
}
</script>
I then have a div called "subLinks" and a div called "links" then use this format for each link on the menu:
<A href="about.htm" onmouseover="displayLinks(0)">
Basically its not doing anything at the moment, however when all the above is in the <head> it works correctly. Is there a way of getting round this and making it work correctly? Any help with this will be much appreciated.
Regards,
Simon.
I'm trying to use JavaScript to display the sub-menu on mouse over using the following script:
<script type="text/javascript">
var sublinks = new Array();
// links for about section
sublinks[0] = new Array();
sublinks[0][0] = { href: 'about.htm', innerHTML: 'About the Senators | ' };
sublinks[0][1] = { href: 'about_perc.htm', innerHTML: 'About the Senators Percussion | ' };
sublinks[0][2] = { href: 'profiles.htm', innerHTML: '2005 Line Profile | ' };
// links for news section
sublinks[1] = new Array();
sublinks[1][0] = { href: 'news.htm', innerHTML: 'News | ' };
sublinks[1][1] = { href: 'news_archive', innerHTML: 'News archive | ' };
sublinks[1][2] = { href: 'latest_news.htm', innerHTML: 'Latest News | ' };
// links for Archive
sublinks[2] = new Array();
sublinks[2][0] = { href: 'archive.htm', innerHTML: 'Archive | ' };
sublinks[2][1] = { href: 'media.htm', innerHTML: 'Media | ' };
sublinks[2][2] = { href: 'shows.htm', innerHTML: 'Shows | ' };
sublinks[2][3] = { href: 'alumni.htm', innerHTML: 'Member Alumni | ' };
var n=0;
function displayLinks
{var sub = document.getElementById('subLinks');
sub.innerHTML = '';
for (var i=0;i<sublinks[n].length;i++) {
sub.innerHTML += '<a href="'+ sublinks[n].href +'">'+ sublinks[n].innerHTML +'</a>';
sub.innerHTML += (i<(sublinks[n].length-1)) ? ' | ' : '';
}
}
</script>
I then have a div called "subLinks" and a div called "links" then use this format for each link on the menu:
<A href="about.htm" onmouseover="displayLinks(0)">
Basically its not doing anything at the moment, however when all the above is in the <head> it works correctly. Is there a way of getting round this and making it work correctly? Any help with this will be much appreciated.
Regards,
Simon.
