Instant popup on mouseover

Posted: April 16th, 2008 | Author: | Filed under: Developers | No Comments »


<pre lang="javascript">
<style type="text/css">
<!--
#dek {POSITION:absolute;VISIBILITY:hidden;Z-INDEX:200;}
//-->
</style>

<script type="text/javascript">
<!--
Xoffset=0; // modify these values to ...Yoffset= 20; // change the popup position.
var old,skn,iex=(document.all),yyy=-1000;
var ns4=document.layersvar ns6=document.getElementById&#038;&#038;!document.allvar ie4=document.all

if (ns4)skn=document.dek
else if (ns6)skn=document.getElementById("dek").style
else if (ie4)skn=document.all.dek.style
if(ns4)document.captureEvents(Event.MOUSEMOVE);
else{skn.visibility="visible"skn.display="none"}
document.onmousemove=get_mouse;

function popup(msg,bak){
  var content="
<table>
<tr>
<td";</td>
content += " bgcolor=\'"+bak+"\'";

  content += ">"+msg+"</td>
</tr>
</table>
";

  yyy=Yoffset;
  if(ns4){
    skn.document.write(content);
    skn.document.close();
    skn.visibility="visible"
  }
  if(ns6){
    document.getElementById("dek").innerHTML=content;
    skn.display=\'\'
  }
  if(ie4){
    document.all("dek").innerHTML=content;
    skn.display=\'\'
  }
}

function get_mouse(e){
  if(ns4||ns6){
    skn.left=e.pageX+Xoffset+\'px\';
    skn.top=e.pageY+yyy + \'px\';
  }else{
    if (document.documentElement){ // IE6 +4.01
      skn.left=event.x+document.documentElement.scrollLeft+Xoffset+\'px\';
      skn.top=event.y+document.documentElement.scrollTop+yyy + \'px\';
    }else if (document.body){ // IE5 or DTD 3.2
      skn.left=event.x+document.body.scrollLeft+Xoffset+\'px\';
      skn.top=event.y+document.body.scrollTop+yyy + \'px\';
    }
  }
}

function kill(){
  yyy=-1000;
  if(ns4){
    skn.visibility="hidden";
  }else if (ns6||ie4)skn.display="none"
}
//--></script></pre>

Usage: <a href="mylinkhere.php" onmouseover="popup('this is a help message', '#00FFFF')" onmouseout="kill()" >click here</a>



Leave a Reply