• 彻底解决IFRAME挡住层(DIV)


    昨天在项目中发现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";
    }


      

  • 相关阅读:
    WCF、WebAPI、WCFREST、WebService之间的区别
    常见的排序方法
    PHP中日期时间函数date()用法总结
    controller中获取全局配置111
    Zf2 自定义组件库如何设置
    module/config/module.config.php文件内涵定义
    zf2环境设置
    菜菜鸟Zend Framework 2 不完全学习涂鸦(四)-- 模块
    菜菜鸟Zend Framework 2 不完全学习涂鸦(三)-- 例子功能设置
    菜菜鸟Zend Framework 2 不完全学习涂鸦(二)-- 类库共享
  • 原文地址:https://www.cnblogs.com/willpower/p/790114.html
Copyright © 2020-2023  润新知