i trying debug legacy web application uses bootstrap.js raise modal , gray out page underneath. warning, not js/html/ccs dev, apparently mine now.
the code working depending on iframe. when iframe consists of standard html, seems work fine. when iframe consists of strange sort-of html produced webfocus (that renders in ie).
anyway, when modal opens, following changes made dom:
this div tag added body element:
<div class="modal-backdrop fade in"></div> the associated styles these:
/*media all*/ .in.modal-backdrop { filter: alpha(opacity=50); opacity: 0.5; } /*media all*/ .fade.modal-backdrop { filter: alpha(opacity=0); opacity: 0; } also, open-modal style applied body element so:
<body class="modal-open"> with associated style:
/*media all*/ .modal-open { overflow: hidden; } now expect modal-backdrop style have apply other empty div tag work. how work? why work when applied 1 type of iframe not another.
the iframe follows:
<iframe name="report content" width="100%" height="400" title="webfocus html report" id="htmlreportframe" src="/path/to/webfocus/report?reportparam=123456" onreadystatechange="readystatechange()" onload="return readystatechange();">your browser not support iframes</iframe> the report reference iframe (/path/to/webfocus/report?reportparam=123456) returns this:
<html> <head> <title>figure 1</title> <style type="text/css"> <!-- @media screen { .spacer { height:792pt; } } @media print { .spacer { height:792pt; } } .x1 { white-space:nowrap; font-family:arial; font-size:7pt; color:#000000; } .x2 { white-space:nowrap; font-family:arial; font-size:9pt; font-weight:bold; color:#000000; } .x3 { white-space:nowrap; font-family:arial; font-size:9pt; font-weight:bold; color:#000000; text-align:left; } .x4 { white-space:nowrap; font-family:arial; font-size:7pt; font-weight:bold; color:#000000; text-align:center; } .x5 { white-space:nowrap; font-family:arial; font-size:7pt; font-weight:bold; color:#000000; } .x6 { white-space:nowrap; font-family:arial; font-size:7pt; font-weight:bold; color:#000000; } .x7 { white-space:nowrap; font-family:arial; font-size:7pt; font-weight:bold; color:#000000; } .x8 { white-space:nowrap; font-family:courier new; font-size:12pt; } .x9 { white-space:nowrap; font-family:courier new; font-size:12pt; } --> </style> </head> <body> <div style="position:relative" class="spacer"> <div style="position:absolute;top:216pt;left:104pt;width:434pt;height:1pt;background-color:#000000; border-top:#000000 1.00pt solid; border-bottom:#000000 1.00pt solid; border-left:#000000 1.00pt solid; border-right:#000000 1.00pt solid; font-size:1pt"></div> <div style="position:absolute;top:237pt;left:104pt;width:432pt;height:1pt;background-color:#000000; border-top:#000000 1.00pt solid; border-bottom:#000000 1.00pt solid; border-left:#000000 1.00pt solid; border-right:#000000 1.00pt solid; font-size:1pt"></div> <div style="position:absolute;top:218pt;left:104pt;width:1pt;height:21pt;background-color:#000000; border-top:#000000 1.00pt solid; border-bottom:#000000 1.00pt solid; border-left:#000000 1.00pt solid; border-right:#000000 1.00pt solid; "></div> <div style="position:absolute;top:218pt;left:536pt;width:1pt;height:21pt;background-color:#000000; border-top:#000000 1.00pt solid; border-bottom:#000000 1.00pt solid; border-left:#000000 1.00pt solid; border-right:#000000 1.00pt solid; "></div> <img src="file:///c:/orange_purple25x12.gif" style='position:absolute;left:108pt;top:222pt;width=25pt;height=12pt;' > <img src="file:///c:/blueline5025x12.gif" style='position:absolute;left:252pt;top:222pt;width=25pt;height=12pt;' > <img src="file:///c:/yellowlavender25x12.gif" style='position:absolute;left:396pt;top:222pt;width=25pt;height=12pt;' > <div style="position:absolute;top:221pt;left:136pt; text-align:left;"> <span class='x5'>category 1</span></div> <div style="position:absolute;top:221pt;left:280pt; text-align:left;"> <span class='x6'>category 2</span></div> <div style="position:absolute;top:221pt;left:424pt; text-align:left;"> <span class='x7'>category 3</span></div> <div style="position:absolute;top:0pt;left:36pt; text-align:left;"> <span class='x2'> </span></div> <div style="position:absolute;top:11pt;left:36pt; text-align:left;"> <span class='x3'>figure name</span></div> <div style="position:absolute;top:23pt;left:297pt; text-align:left;"> <span class='x4'>united</span></div> <img src="file:///c:/ibiuniquename0.png" style='position:absolute;left:36pt;top:33pt;' > <div style="position:absolute;top:28pt;left:36pt; text-align:left;"> <span class='x8'> </span></div> </div> </body> </html> it looks standard html, except reference local image files (for example file:///c:/ibiuniquename0.png) don't exist. believe being delivered browser using sort of strange mime type, don't know how.
i can post more code, need remove sensitive information.
Comments
Post a Comment