一个层的定位有关问题

WBOY
Release: 2016-06-13 13:37:49
Original
867 people have browsed it

求助一个层的定位问题
一个后台页面,
内空页面是在一个iframe里面显示的。

现在在内容页面,要加一个浮动层(显示一个等待的效果)。

结果那一个层只覆盖了内容页框架的内容。

我的要示是:覆盖整个页面,(也就是说,浮动层可以覆盖框架外的内容),

我该怎么做。

我想这样写了

CSS code
<!--

Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/

-->

#load{padding:10px;
 width:600px;height:300px;
 display:block; 
 position: absolute;
 top:50%;
 left:50%;
 margin-left:-300px;
 margin-top:-150px;}



Copy after login




JS 是这样写的。

$("#load").css("display","block");
$("#img_load")[0].src='/data/images/img_load.gif';




------解决方案--------------------
jquery 直接用div 弹出插件.设置 插件弹出的比例即可...不过 我忘记了那插件名字了.嘿嘿
------解决方案--------------------
jqModal
------解决方案--------------------
O(∩_∩)O哈哈~,我刚刚做了这个项目,给你点经验:

jQuery 操作IFRAME 

DOM方法:

父窗口操作其下的IFRAME:window.frames["iframeName"].document

或者直接写frames["iframeName"].document

IFRAME操作父窗口: window.parent.document

或者直接写parent.document

 

jquery方法:

在父窗口中操作 其下IFRAME中的元素: $(window.frames["iframeName"].document).find(”:text”);

在IFRAME中操作 选中父窗口中的所有输入框:$(window.parent.document).find(”:text”);

 

使用find可以找到自己想要的东东。

想要找到同级的iframe,可以用$(parent.frames["iframeName"]).find("xxxxxx")

 

细心的朋友一下就能理解,原理其实很简单,就是用到了$(DOM对象)转换成jquery对象。

例子:
HTML code

<!--index.php-->
<script type="text/javascript" src="javascript/jquery_1.4.2.js"></script>
<div id="ifr">
            <iframe id="iframe" name="showMap" width="100%" height="600" src="map.php"></iframe>
<br><font color="#e78608">------解决方案--------------------</font><br>你们要是真心的帮助LZ,那么就请贴出可供测试的代码<br>否则,我就要将此贴移动了
<br><font color="#e78608">------解决方案--------------------</font><br>好吧,我承认是着急了点,还是把上面的帖子移除吧,这是个可测试的:<br>在iframe的父级页面和元素页面必须都连接上<script type="text/javascript" src="jquery_1.4.2.js"></script> 才管用<br><dl class="code">HTML code<pre class="brush:php;toolbar:false">

<!--index.html-->



<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script type="text/javascript" src="jquery_1.4.2.js"></script> 



<div id="show3dmap" style="border:solid 1px">此div的宽高与body相当
  <div id="ifr"> 
    <iframe id="iframe" name="show" width="100%" height="600" src="cont.html"></iframe> 
  </div>
</div>



<!--cont.html-->



<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script type="text/javascript" src="jquery_1.4.2.js"></script>



<div>这是子页面
<input type="button" id="full" value="点击覆盖">
<input type="button" id="replace" value="点击替换父级div">
</div>
<script>
$("#replace").live("click",function(){
  $(window.parent.document).find("#iframe").css({'display':'none','visibility':'hidden'});
  $(window.parent.document).find("#show3dmap").html("<div id='rep' style='width:1200px;height:1000px;z-index:2;'>"+
      "这里替换内容</script>
Copy after login
"); }); $("#full").live("click",function(){ //$(window.parent.document).find("#iframe").css({'display':'none','visibility':'hidden'}); $(window.parent.document).find("#show3dmap").css({'display':'none','visibility':'hidden'}); $(window.parent.document).find("body").append("
"+ "这里的宽和高是含iframe的父级页面的宽和高,即当前浏览器的可视窗口大小(自定义)
可定义按钮来关闭此div:
"); }); //close $(window.parent.document).find("#btn").live("click",function () { //$(window.parent.document).find("#iframe").css({'display':'block','visibility':'visible'}); $(window.parent.document).find("#show3dmap").css({'display':'block','visibility':'visible'}); $(window.parent.document).find("#div").remove(); });
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Recommendations
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!