View picture on mouseover text

  • Thread starter Thread starter Guest
  • Start date Start date
G

Guest

Please excuse my ignorance. I’m just starting to learn how to use Frontpage.

I have created a table with 2 cells. In one cell I have some text and in
the other I have put a small graphic.

Is it possible without knowing anything about programming code to make the
picture only be seen when the mouse is over the text. Can it be done via
frontpage.

I did a google search and there are lots of answers but they all need you to
understand the code and I only started this last week – it’s a VERY steep
learn curve but not at the top yet.

Thank you.
 
MikeCCC said:
Please excuse my ignorance. I’m just starting to learn how to use
Frontpage.

I have created a table with 2 cells. In one cell I have some text
and in the other I have put a small graphic.

Is it possible without knowing anything about programming code to
make the picture only be seen when the mouse is over the text. Can
it be done via frontpage.
Click to expand...

Well, you don't have to know too much about programming (although that
helps), but you do need to know how to do a cut and paste operation.

I can probably send you some code that does this. But it does use some JS
and some HTML which calls it - you have to paste both into your HTML
I did a google search and there are lots of answers but they all need
you to understand the code and I only started this last week – it’s a
VERY steep learn curve but not at the top yet.

Thank you.
Click to expand...

If you post back with your code, I can probably tailor it (and post it back)
so that it needs very little effort on your part to make it work
 
MikeCCC said:
Please excuse my ignorance. I’m just starting to learn how to use
Frontpage.

I have created a table with 2 cells. In one cell I have some text
and in the other I have put a small graphic.

Is it possible without knowing anything about programming code to
make the picture only be seen when the mouse is over the text. Can
it be done via frontpage.

I did a google search and there are lots of answers but they all need
you to understand the code and I only started this last week – it’s a
VERY steep learn curve but not at the top yet.

Thank you.
Click to expand...

Here is some code which will do the job. On mouseover of the text it shows
the image. On mouseout of the text, it hides it.

In FP, you need to use the HTML or Code tab. This will open the HTML code
for editing.

Cut this code and paste it between <head> and </head>:
<script type="text/javascript">
function showimage(id)
{document.getElementById(id).innerHTML='<img src="images/image.jpg" />'}
function hideimage(id)
{document.getElementById(id).innerHTML=''}
</script>

Alter your table to look something like this:
<table>
<tr>
<td onmouseover="showimage('col2')" onmouseout="hideimage('col2')">text
for image</td>
<td id="col2"></td>
</tr>
</table>

The important things are that the cell in which you have the text to
mouseover has onmouseover="........" and onmouseout="........."
and that the cell in which you want the image to appear has id="col2".

Actually, "col2" can be anything so long as you use the same id in both
cells
 
Back
Top