Copy Code code as follows:
<span style= "FONT-SIZE:14PX;" ><script type= "Text/javascript" >
var eposx;
var Eposy;
function Showrequest (pid,event) {
Eposx = Event.clientx;
Eposy = Event.clienty;
var url= "tip.jsp";
var params = ' pid= ' + pid + ' &time= ' + (new Date ()). ToString ();
SendRequest (Url,params, ' get ', showdetail);
}
Dynamic Load Data Department list
function ShowDetail () {
if (httprequest.readystate = = 4) {
if (Httprequest.status = = 200) {
var membersdata = HttpRequest.responseXML.getElementsByTagName ("member");
var memberslist = document.getElementById ("detail");
Loop data into a list box
var li = ' <table> ';
for (Var i=0;i<membersdata.length;i++) {
var Price=membersdata[i].childnodes[0].firstchild.nodevalue;
var Num=membersdata[i].childnodes[1].firstchild.nodevalue;
var Chandi=membersdata[i].childnodes[2].firstchild.nodevalue;
Li + + ' <tr><td> prices: ' + price + ' </td></tr> ';
Li + + ' <tr><td> quantity: ' + num + ' </td></tr> ';
Li + + ' <tr><td> Origin: ' + Chandi + ' </td></tr> ';
}
Li + + ' </table> ';
memberslist.innerhtml = Li;
Setdivposition ();
memberslist.style.visibility= ' visible ';
} else {//page is not normal
Alert ("The page you requested has an exception");
}
}
}
function Hidendiv () {
var memberslist = document.getElementById ("detail");
memberslist.innerhtml = ';
memberslist.style.visibility= ' hidden ';
}
function Setdivposition () {
var goodslist = document.getElementById (' goodslist ');
EPOSX = Goodslist.offsetleft + goodslist.offsetwidth-2;
Eposy + = goodslist.offsettop-100;
var listdiv = document.getElementById (' detail ');
listdiv.style.left=eposx+ ' px ';
Listdiv.style.border= ' Blue 1px solid ';
Listdiv.style.top=eposy + ' px ';
Listdiv.style.width= ' 100px ';
listdiv.style.zindex= ' 999 ';
}
</script>
<body>
Product List:
<p id= "Goodslist" style= float:left; "onmouseout=" Hidendiv (); " >
<a href= "javascript:void (0);" onmouseover= "showrequest (' P1 ', event);" > Product a</a><br/>
<a href= "javascript:void (0);" onmouseover= "Showrequest (' P2 ', event);" > Product b</a><br/>
<a href= "javascript:void (0);" onmouseover= "showrequest (' P3 ', event);" > Products c</a><br/>
</p>
<div id= "Detail" style= "Background-color:green;position:absolute;visibility:hidden" >
</div> </span>