昨天在项目中发现IFRAME挡住层(DIV),一个页面有4个IFRAME,IFRAME页面中跟随鼠标的层
在IFRAME边缘总是被其他IFRAME挡住,郁闷了好久,在网上也找了好多资料,都没能很好解决.
用window.createPopup()也不行,因为父页面框架中有定时器刷新,不过window.createPopup()创建
弹出页面我个人觉得比DIV要强,不用自己控制什么时候关闭:
function showInfo1(unit,day, revenue)
{
var content = "<table border='1' cellpadding='3' style='font-size:10pt; " +
"font-family:verdana; background-color:#CCCCFF' width='230'>";
content += "<tr><td width='80'><b>单位</b></td><td >" + unit + "</td></tr>";
content += "<tr><td width='80'><b>日期</b></td><td >" + day + "</td></tr>";
content += "<tr><td width='80'><b>抄表数</b></td><td>" + revenue + "</td></tr>";
content += "<tr><td width='80'><b>例日应抄数</b></td><td>" + (parseInt(revenue)+ 1000)+ "</td></tr>";
content += "<tr><td width='80'><b>按期抄表率</b></td><td>" + Math.round(parseInt(revenue*100)/ (parseInt(revenue)+ 1000)) + "%</td></tr>";
content += "<tr><td colspan='2'><b>抄表相关考核:</b></td></tr>";
content += "<tr><td colspan='2'>1)<a href='/quality/OnTimeCopyRateAction.action'>按期抄表率分析</a></td></tr>";
content += "</table>";
var oPopup = window.createPopup();
var oPopupBody = oPopup.document.body;
//oPopupBody.style.backgroundColor = "magenta";
//oPopupBody.style.border = "solid blue 3px";
oPopupBody.innerHTML = content;
oPopup.show(window.event.x, window.event.y, 300, 200, document.body);
}
晚上想到了一个好办法,把原来在IFRAME中的DIV放到它的父页面,这样在IFRAME中弹出父页IFRAME面
的DIV就不会被其他IFRAME挡住了
父页面:<div id="detailInfo" style="position:absolute;overflow:auto;overflow-x:auto;z-index:1;"></div>
IFRAME中:<img onclick='showInfo(null);'onmouseover='showInfo(\"{dataSetName}\",\"{xLabel}\", {value});'>
function showInfo(unit,day, revenue)
{
var obj;
if (document.getElementById)
//IE 5.x or NS 6.x or above
obj = parent.document.getElementById('detailInfo');
else
//IE 4.x
obj = parent.document.all['detailInfo'];
if (unit==null)
{
obj.style.visibility = "hidden";
return;
}
var content = "<table border='1' cellpadding='3' style='font-size:10pt; " +
"font-family:verdana; background-color:#CCCCFF' width='230'>";
content += "<tr><td width='80'><b>单位</b></td><td >" + unit + "</td></tr>";
content += "<tr><td width='80'><b>日期</b></td><td >" + day + "</td></tr>";
content += "<tr><td width='80'><b>抄表数</b></td><td>" + revenue + "</td></tr>";
content += "<tr><td width='80'><b>例日应抄数</b></td><td>" + (parseInt(revenue)+ 1000)+ "</td></tr>";
content += "<tr><td width='80'><b>按期抄表率</b></td><td>" + Math.round(parseInt(revenue*100)/ (parseInt(revenue)+ 1000)) + "%</td></tr>";
content += "<tr><td colspan='2'><b>抄表相关考核:</b></td></tr>";
content += "<tr><td colspan='2'>1)<a href='/quality/OnTimeCopyRateAction.action'>按期抄表率分析</a></td></tr>";
content += "</table>";
obj.style.left=(window.event.x).toString()+'px';
obj.style.top=(window.event.y).toString()+'px';
obj.innerHTML = content;
obj.style.visibility = "visible";
}