求助一个层的定位问题
一个后台页面,
内空页面是在一个iframe里面显示的。
现在在内容页面,要加一个浮动层(显示一个等待的效果)。
结果那一个层只覆盖了内容页框架的内容。
我的要示是:覆盖整个页面,(也就是说,浮动层可以覆盖框架外的内容),
我该怎么做。
我想这样写了
- CSS code
#load{padding:10px; width:600px;height:300px; display:block; position: absolute; top:50%; left:50%; margin-left:-300px; margin-top:-150px;}</style>
<div id="load" style="display:none;"><img id="img_load" src=""></img></div>
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>
[解决办法]
你们要是真心的帮助LZ,那么就请贴出可供测试的代码
否则,我就要将此贴移动了
[解决办法]
好吧,我承认是着急了点,还是把上面的帖子移除吧,这是个可测试的:
在iframe的父级页面和元素页面必须都连接上<script type="text/javascript" src="jquery_1.4.2.js"></script> 才管用
- HTML code
<!--index.html--><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script type="text/javascript" src="jquery_1.4.2.js"></script> </head><body><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></body></html><!--cont.html--><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script type="text/javascript" src="jquery_1.4.2.js"></script></head><body><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;'>"+ "这里替换内容</div>");});$("#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("<div id='div' style='border:solid 1px;width:1200px;height:1000px;z-index:2;'>"+ "这里的宽和高是含iframe的父级页面的宽和高,即当前浏览器的可视窗口大小(自定义)<br>可定义按钮来关闭此div:<input type='button' id='btn' value='关闭' /></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(); });</script></body></html>