又解决了一个问题...之前想太复杂了...
父页面http://localhost:8080/parent/index.jsp
子页面http://localhost:8081/child1/day.jsp
子页面通过iframe嵌入到父页面,然后子页面里面要在父页面上生成一个div,
div.innerHTML = '<img src="<%=request.getContextPath()%>/images/loading.gif" />'
出来后变成http://localhost:8080/child1/images/loading.gif (因生成到父页面,故IP及端口自然变成成父页面的了)
而正常的要http://localhost:8081/child1/images/loading.gif
解决方法:直接在子页面把图片的完整路径带过去。
代码如下:
function createTopDivIfNotExist(){
var topDoc = top.document;
var chartDiv = topDoc.getElementById('topDiv');
if(chartDiv == null || typeof(chartDiv) == 'undefined'){
var chartDiv = topDoc.createElement('div');
topDoc.body.appendChild(chartDiv);
chartDiv.id = 'topDiv';
chartDiv.innerHTML = '<img src="<%=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/"%>images/kpiUp.jpg" />';
//chartDiv.innerHTML = '<img src="<%=request.getContextPath()%>/images/kpiUp.jpg" />';//错误的
chartDiv.onmouseover = function(){topDoc.getElementById('topDiv').style.display='block';};
chartDiv.onmouseout = function(){topDoc.getElementById('topDiv').style.display='none';};
with(chartDiv.style) {
position = 'absolute';
background = '#F5F5F5';
width = '330';
height = '250';
top = 300;
left = 300;
display = 'block';
style ='position:absolute;background-color:#F5F5F5';
}
}
}
分享到:
相关推荐
标题 "拖拽一个iframe中的div 在另一个iframe页面中显示" 描述了在Web开发中一个交互性的技术,涉及跨框架(iframe)通信和DOM操作。这个技术主要应用于创建富交互的用户界面,允许用户在不同的iframe之间传递和操作...
在网页设计中,`iframe` 是一种非常有用的元素,它允许我们在一个页面中嵌入另一个网页。当有多个 `iframe` 并存时,可能会出现重叠或者层级问题,特别是当其中某个 `iframe` 中有一个需要突出显示的 `div` 元素时。...
2. **遮罩层**:为了实现遮罩效果,我们需要在子页面中添加一个全屏的透明div,作为遮罩层。这个div通常设置为全屏尺寸,并设置较低的不透明度,以达到半透明的效果。同时,它的初始样式也需要设置为隐藏。 3. **...
如果两者相等,说明页面不是在`iframe`内加载,此时`div`元素(id为`top`)会显示;反之,如果`window.top`不等于`window.self`,则表示页面在`iframe`中,`div`将被隐藏。 ```html 测试 function getStyle()...
本文将深入探讨如何利用EasyUI的Window插件在Layout框架页面中实现弹出窗体到最顶层的效果,尤其是当窗体需要穿越iframe时。 首先,我们需要理解jQuery EasyUI的Window组件。Window是EasyUI中的一个动态弹出窗口,...
在Web开发中,有时我们需要在嵌入的`iframe`中操作父窗口的元素,例如在本例中,我们需要在`iframe`内的页面通过JavaScript实现一个动画效果,让父窗口上的某个`div`元素能够展开和收缩,而不需要修改父窗口的代码。...
1. 使用jQuery bgiframe插件:该插件创建一个透明的iframe层,将被遮挡的div覆盖在select之上,从而避免遮挡问题。 2. 避免使用绝对或相对定位:改用其他布局方式,如使用浮动(float)或Flexbox(对于现代浏览器)...
在IE6中,Select元素具有“下拉菜单”的特性,它会被渲染在页面的最顶层,即使它在HTML结构中位于其他元素(如Div)之下。这种行为是由于IE6对CSS层叠上下文理解的局限性,以及对z-index属性的不完全支持导致的。 ...
首先,我们需要了解模态窗口(Modal Window)是一种常用的用户界面元素,它允许用户在页面的主内容之上显示一个新的弹出层。这种弹出层通常用于展示额外信息、提示消息、表单输入等,且会阻塞背景页面的其他交互直到...
3. **样式转换**:遍历渲染队列,将CSS样式转换为Canvas API可识别的参数,例如,将文本样式转换为`setFillStyle`,调用`fillText`绘制文本,调用`drawImage`绘制图片,对于设置了背景色的div使用`fillRect`等。...
当页面嵌套在多个 `iframe` 中时,`top.location.reload()` 可用于刷新最外层的页面。 **刷新弹出窗口:** ```javascript opener.location.reload(); ``` 如果页面是通过 `window.open()` 打开的新窗口,则可以...
这种方式适用于嵌套在`iframe`中的页面。当需要更新`iframe`中的内容时,可以通过调用`parent.location.reload()`来实现整个父页面的刷新,从而间接地刷新`iframe`内部的内容。 #### 2. 关闭弹出对话框并刷新页面 `...
然后,在标签中加入onload事件,使Load()函数在页面加载完成时被调用,同时页面中需要一个用于显示倒计时信息的<div>元素。 ```html ('index.asp')"> <div id="ShowDiv"></div> ``` 第二种方法是通过一个简单的...
通过将Flash嵌入脚本放入一个Div容器中,我们可以更好地控制其在页面中的位置和层级关系。例如: ```javascript var so = new SWFObject("XXX.swf", "flashId", "宽度", "高度", "版本", "背景色"); // 设置Flash...
这个`div`通常放置在页面的最顶层,用于覆盖页面的所有内容。 ```html <div unselectable="on" style="background:#000;filter:alpha(opacity=10);opacity:.1;left:0px;top:0px;position:fixed;height:100%;width...
2. **使用`z-index`层级控制**:通过调整元素的`z-index`值来确保拖动条始终位于最顶层,即使在`iframe`之上。 3. **禁用`iframe`内的鼠标事件**:通过JavaScript监听`iframe`的鼠标事件,并阻止它们向父级元素传播...
这行代码的作用是防止在框架内打开新窗口时出现重复的导航栏,确保用户总是在最顶层的窗口中操作。 #### 2. `function switchSysBar()` 这个函数用于切换左侧栏的显示与隐藏。通过改变`switchPoint.innerText`的值...
同时,为了确保弹出层能够正确地显示在页面上,还定义了z-index属性,使其始终处于顶层。 总的来说,popShow插件(改进版)通过简单的API和强大的内部实现,为Web开发人员提供了一种简便的方式来快速添加和管理弹出...