JavaScript implements a simple Tip prompt box effect

This article describes JavaScript to achieve a simple Tip prompt box effect. To share with you for your reference, as follows:

// JavaScript Document
document.write("<div id='tip' style='position:absolute; width:300px; z-index:1; background-color: #ffffff; border: 1px solid gray; overflow: visible;visibility: hidden;font-size:12px;padding:12px;color:#333333'></div>")
function showtip(w){
 var x=event.x;
 var y=event.y;
 tip.innerHTML=w;
 tip.style.visibility="visible";
 tip.style.left=x+10;
  tip.style.pixelTop=y+document.body.scrollTop+10;
}
function hidetip(){
 tip.style.innerHTML=""
 tip.style.visibility="hidden";
}

Save the above as: showtip.js

<table width="100%" border="0" cellspacing="0" cellpadding="0" background="#F7F7F0">
<tr height="25">
<td background="images/line-dot.gif" height="20" align="left"><IMG height="5" src="images/dot2.gif" width="5">
<a 
 onmousemove="showtip('<b> Title: </b><br> Graduated from the girl   Confidence is more outside the package <br>')" 
 onmouseout=hidetip() 
 href='Common/NewsDetails.aspx?id=1035'
 target=_blank>
  Graduated from the girl   Confidence is more outside the package 
 </a>
</td>
</tr>
<tr>
<td background="images/point_h.gif" height="1"></td>
</tr>
</table>

More about JavaScript related content interested readers to view this site project: JavaScript switching effects and skills summary, JavaScript lookup algorithm skills summary, JavaScript animation effects and skills summary, JavaScript error and debugging techniques, JavaScript data structure and algorithm skills summary, JavaScript times calendar calculation method and skills summary and "JavaScript mathematical operation usage summary"

Hope this article described to everyone JavaScript program design is helpful.