I figured out a new way to do it so that it will work in the other browsers. You can remove ignore the previous method completely. You don't need any of those steps with the new method. To give proper credit, I used this code https://gist.github.com/csasbach/867744 and then just made changes.

Here is my test page http://kidsnmissions.com/test.html

First you need to upload the 2 files that I attached. They will contain most of the code. You upload them once and then all of your pages will reference these files.

Then you need to add some code to your page:

1. On the line above </head> add this line:
<link rel="stylesheet" href="tooltip.css" />

2. On the line above </body> add these 2 lines:
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js'></script>
<script type='text/javascript' src='touchHover.js'></script>

3. Wherever you want the mouseover, use this:
<abbr title="This is the mouseover text">ch3</abbr>

 

 

 

Reftagger Instructions  http://reftagger.com/

Copy and paste the script before the last body tag.

<script src="http://bible.logos.com/jsapi/referencetagging.js" type="text/javascript"> </script>
<script type="text/javascript">
Logos.ReferenceTagging.lbsBibleVersion = "ESV";
Logos.ReferenceTagging.lbsLinksOpenNewWindow = true;
Logos.ReferenceTagging.lbsLogosLinkIcon = "dark";
Logos.ReferenceTagging.lbsNoSearchTagNames = [ "h2", "h3", "h3" ];
Logos.ReferenceTagging.lbsTargetSite = "biblia";
Logos.ReferenceTagging.tag();
</script>

 

 

Pop Up box INSTRUCTIONS: Below

1) Cut and paste the given code (script to script) in between the <head> and </head> tags of a html page

2) Ensure that the <body> tag of html page is written as <BODY onload="initalt()">

3) When giving a hyperlink to a page write the <a href ="">Link Name</a> as follows
<a href="" onmouseover="doalt('your message')" onmouseout="realt()">Link</A>

4) In the above line instead of "your message" You can give your own message what ever
you want to be displayed

    Website Text also saved in email in Computer Helps folder.
 

<script language="javascript">
function initalt()
{
altback="#00FFFF"
altborder="CEDEE7"
altfont="Comic Sans MS" // Alt-Message Font
altfontcolor="000000"// Alt-Message Font color
altfontsize="5" // Alt-Message Font Size
altoffx=5 // Alt-Message horizontal offset from mouse-position
altoffy=15 // Alt-Message vertical offset from mouse-position
altwidth=680 // Alt-Message width, will be expanded by your message
altheight=0 // Alt-Message height, will be expanded by your message
// end of Variables
document.onmousedown = sniff
document.onmousemove = sniff
document.onmouseup = sniff
if (document.layers)
{ //NS
document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP)
document.layers['altmessage'] = new Layer(altwidth)
document.layers['altmessage'].left = 0
document.layers['altmessage'].top = 0
document.layers['altmessage'].height = altheight
document.layers['altmessage'].bgColor = altback
document.layers['altmessage'].visibility = "hidden"
document.layers['altmessage'].borderStyle = "solid"
document.layers['altmessage'].borderColor = altborder
document.layers['altmessage'].borderWidth = 1
}
else if (document.all)
{ //IE
document.body.insertAdjacentHTML("BeforeEnd",'<DIV ID="altmessage" STYLE="z-index:200;position:absolute;width:'+altwidth+';height:'+altheight+';left:0;top:0;visibility:hidden;background:'+altback+';border-style:solid;border-width:10;border-color:'+altborder+'"></DIV>')
}
}

function sniff(e)
{
// GETS Mouseposition
if (document.layers)
{
var mousex=e.pageX; var mousey=e.pageY;document.layers['altmessage'].left = mousex+altoffx;document.layers['altmessage'].top = mousey+altoffy
}
else if (document.all)
{
var mousex=event.x; var mousey=event.y+document.body.scrollTop;altmessage.style.top=mousey+altoffy;altmessage.style.left=mousex+altoffx
}
}

function doalt(message)
{
//The main routine
content='<font face="'+altfont+'" size="'+altfontsize+'" color="'+altfontcolor+'">'+message+'</FONT>'
if (document.layers)
{
with (document.layers['altmessage'].document)
{
open()
write(content)
close()
}
document.layers['altmessage'].visibility = "show"
}
else if (document.all)
{
document.all['altmessage'].innerHTML = content
document.all['altmessage'].style.visibility = "visible"
}
}
function realt()
{
if (document.layers)document.layers['altmessage'].visibility = "hidden";
else if (document.all) document.all['altmessage'].style.visibility = "hidden";
}
</script>

 

This Example gives you a clear cut idea of the sequence of tags in html page

<html>
<head>
Place the script within <head> and </head> tags as shown here
</head>
<BODY onload="initalt()">
The URL below to be placed as required with in <body> and </body> tags. You can use it for image links also.
<a onmouseover="doalt('Type your pop up text here')" onmouseout="realt()">LINK</A>
</body>
</html>

This is the way the body tag should look if you are swaping image:

<BODY onload="initalt();MM_preloadImages('/VCSUSHISTORY/rickenbacker.jpg')">

This is the way the tag should look like when using an image for the pop up

<a onmouseover="doalt('Type your pop up text here')" onmouseout="realt()"><IMG align="left" src="inauguration.png" width="426" height="276"></A>