James said:
Thanks,
I'l give your suggestion a shot. Not being an expert, I'll probably
get stuck somewhere along the line...
I'll post back and let you know in a day or two.
Jim,
Here is an example of what I mean by using onmouseover to display an image.
This has the disadvantage (or it could be an advantage) that the image
always appears in the same place. It is sized at 100px X 25px and positioned
at 200px from left, 30px from top.
There are ways of ensuring that the <div> with the image follows the mouse
cursor (like a tooltip). This is a little more complex, but I have tested it
and it works. If you want this feature, I will post the code.
<html>
<head>
<script language="JavaScript">
function hideit(elid)
{
var e = document.getElementById(elid).style
e.display = (e.display != 'block') ? "block" : "none"
}
function setImage(id,txt)
{ document.getElementById(id).innerHTML = txt }
</script>
</head>
<body>
<div id="layer1"
style="position: absolute; width: 100px; height: 25px;
z-index: 1; left: 200px; top: 30px;
font-family: verdana,arial,sans-serif;
font-size: 14px; font-color: black;
border: solid black 1px; display: none;">
</div>
<a href="#" onmouseover="hideit('layer1');setImage('layer1',
'<img src = \'images\\yellbox.gif\'>');"
onmouseout="hideit('layer1');">
Some English text</a>
</body>
</html>
Note that in this parameter '<img src = \'images\\yellbox.gif\'>');"
the extra slashes ( \ ) are necessary, i.e. \' not ' and \\ not \
A file 'images\anyfile.gif' has to be entered as \'images\\anyfile.gif\'
You will need to create the image file containing the Japanese text and and
use it instead of 'yellbox.gif' (which was just a file I used for testing).
If this image file is greater in size than 100px X 25 px, then adjust the
width and height in <div id ="layer1" ..> to its size.
I'll be interested to see how you progress.
