Change text on mouseover

80mmfish · 04-25-2012, 03:59 PM

Im new to this forum and was wondering if anyone would mind helping me out.

Im attempting to modify some code i found here through google to be used to change a welcome screen to 4 different languages besides english.

heres the code

<code>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">

<style type="text/css">
.hide {
display:none;
}
.show {
display:inline;
}
</style>

<script type="text/javascript">
if(window.addEventListener){
window.addEventListener('load',showlinks,false);
}
else {
if(window.attachEvent){
window.attachEvent('onload',showlinks);
}
}

function showlinks() {

lis=document.getElementById('nav').getElementsByTagName('li');

for(c=0;c<lis.length;c++){

lis[c].onmouseover=function() {
this.getElementsByTagName('span')[0].className='hide';
this.getElementsByTagName('span')[1].className='show';
}

lis[c].onmouseout=function() {
this.getElementsByTagName('span')[0].className='show';
this.getElementsByTagName('span')[1].className='hide';
}
}
}
</script>

</head>
<body>

<ul id="nav">
<li>
<span>[Closed]</span>
<span class="hide"><a href="http://www.codingforums.com/">codingforums.com</a></span>
</li><li>
<span>[Closed]</span>
<span class="hide"><a href="http://www.google.com/">google.com</a></span>
</li><li>
<span>[Closed]</span>
<span class="hide"><a href="http://www.bbc.co.uk/">bbc.co.uk</a></span>
</li><li>
<span>[Closed]</span>
<span class="hide"><a href="http://w3c.org/">w3c.org</a></span>
</li>
</ul>

</body>
</html>
</code>

As far as i can tell, if i just add the correct number of span id's it should work, or is there a different code i must plug in to get it to switch to the different languages.

EpicWebDesign · 04-25-2012, 04:22 PM

I'm not quite clear what you are asking. The code example you provided simply hides the wording of a link until you mouse-over it. The only span ID's are "show" and "hide" because that's really all this script does. It has nothing to do with translation.

Are you saying that you have already translated the website into the multiple languages and simply want to use this type of script as an interactive navigation to direct users to the correct version of the site (based on their language selection)? For example: You could display an image of each country's flag by default and then the actual name of the language would appear when they mouse-over it.

I'm not sure what it is that you want to modify (besides the links) so they point to the correct area of your site. Can you please clarify what it is that you need?

Philip M · 04-25-2012, 06:56 PM

BTW, when posting here please help us to help you by following the posting guidelines and wrapping your code in CODE tags. This means use the octothorpe or # button on the toolbar. The word CODE is in capitals. You can (and should) edit your previous ost.